*{/* font-size: 16px; */padding: 0;margin: 0;} .Hometitle {margin-bottom: calc(40 / 16 * 1em);position: relative;z-index: 1;line-height: 1;letter-spacing: 5px;background: -webkit-linear-gradient(right, rgba(21,80,145,0) 0%,rgba(21,80,145,1) 99%,rgba(21,80,145,1) 100%); background: linear-gradient(to left, rgba(21,80,145,0) 0%,rgba(21,80,145,1) 99%,rgba(21,80,145,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#155091', endColorstr='#6617c971',GradientType=0 );} .Hometitle .cn {font-size: calc(32 / 16 * 1em);color: #fff;font-weight: bold;color: #fff;padding: 20px 30px 20px 0;/* display: inline-block; */width:100%;background: -moz-linear-gradient(right, rgba(21,80,145,0) 0%, rgba(21,80,145,1) 99%, rgba(21,80,145,1) 100%); } .Hometitle .en {text-transform: uppercase;color: #fff;opacity: 0.1;} .Hometitle .en {font-size: calc(100 / 16 * 1em);opacity: 0.06;position: absolute;top: 50%;width: 100%;transform: translateY(-50%);font-weight: bold;z-index: -1;} .Hometitle-b{background: -moz-linear-gradient(right, rgba(21,80,145,0) 0%, rgba(21,80,145,1) 99%, rgba(21,80,145,1) 100%); background: -webkit-linear-gradient(right, rgba(21,80,145,0) 0%,rgba(21,80,145,1) 99%,rgba(21,80,145,1) 100%); background: linear-gradient(to left, rgba(21,80,145,0) 0%,rgba(21,80,145,1) 99%,rgba(21,80,145,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#155091', endColorstr='#6617c971',GradientType=0 ); } .Hometitle-b .cn {color: #fff;letter-spacing: 1px; padding: 20px 30px 20px 0;/* display: inline-block; */width: 100%; } .Hometitle-b .en {color: #0a2378;display: none;} .Hometitle.center{ text-align: center;} .Homemore { display: inline-block; background:#155091; color: #fff; transition: 0.5s; line-height: 3.25; padding: 0 1em; min-width: calc(150 / 16 * 1em); text-align: center;font-size: calc(16 / 16 * 1em) } .Homemore:after { display: inline-block; content: ''; width: 0.5em; height: 0.5em; transform: rotate(45deg); border-top: 2px solid #fff; border-right: 2px solid #fff; margin-left: 1.125em; vertical-align: middle;margin-top: -5px; } .Homemore:hover { background-color: #ac1e2a; color: #fff; } @media(max-width: 1024px) { .Hometitle{margin-bottom: calc(25 / 16 * 1em);} .Hometitle .en {font-size: calc(55 / 16 * 1em);display: none;} .Hometitle .cn {font-size: calc(22 / 16 * 1em);width: 80%;padding: 15px 20px;} } /*Floor003155 */ .Floor003155 .fp-menu { position: fixed; z-index: 110; left: 2em; top: 50%; transform: translateY(-50%); } .Floor003155 .fp-menu li { position: relative; padding: 12px 0; width: 20px; } .Floor003155 .fp-menu li a { display: block; width: 8px; height: 8px; background-color: rgba(255,255,255,0.2); border-radius: 50%; margin: 0 auto; transition: 0.3s; } .Floor003155 .fp-menu li span { position: absolute; left: 100%; top: 50%; transform: translateY(-50%); font-size: 0.875em; color: #fff; margin-left: 0.625em; line-height: 1.2; visibility: hidden; } .Floor003155 .fp-menu li:nth-child(1) span { transform: rotate(90deg); transform-origin: top; } .Floor003155 .fp-menu li.active span { visibility: initial; } .Floor003155 .fp-menu li.active a { background-color: #ac1e2a;} .Floor003155 .fp-menu[type='white'] li a { background-color: #ccc; } .Floor003155 .fp-menu[type='white'] li span { color: #000000; } .Floor003155 .fp-menu[type='white'] li.active a {background-color: #ac1e2a; } @media (max-width:1200px) { .Floor003155 .fp-menu { display: none; } } .layer-open .mainBox > *:not(.Top003198){ -webkit-filter: blur(20px); filter: blur(20px);} /* top */ /*Top003198 */ .Top003198{position:fixed;z-index:999;left:0;top:0;width:100%;background-color:#155091;box-shadow:0 0 10px rgba(0,0,0,0.1);} .Top003198 menu li span{display:block;} .Top003198 menu li span a{display:block;position:relative;z-index:1;font-size:calc(19 / 16 * 1em);} .Top003198 menu li span a:after{position:absolute;content:'';right: -27px;top: 36%;width: 1px;height: 18px; transform: translateX(-50%); background: linear-gradient(to bottom, rgb(255 255 255 / 40%), #fff, rgb(255 255 255 / 40%));transition:0.3s;} .Top003198 menu li:hover span a:after, .Top003198 menu li.aon span a:after{width:1px;} .Top003198 li .sub .pic .Ispic{padding-bottom:calc(400 / 310 * 100%);background-color:#eee;} .Top003198 .top-hotline{color:#155091;font-size:calc(20 / 16 * 1em);padding-left:calc(29 / 20 * 1em);background:url(../images/Top003198-tel.svg) no-repeat left center;background-size:1em auto;line-height:calc(36 / 20 * 1em);} .Top003198 .search { position: relative; z-index: 100; } .Top003198 .open-search { background: url(../images/search_white.svg) no-repeat center center; width: calc(30 / 16 * 1em); height: calc(30 / 16 * 1em); display: block; background-size: auto 75%; margin-top: 3px; } .Top003198_fixed .open-search { background-image: url(../images/search.svg); } .Top003198 .top-search { position: absolute; top: 174%; right: 0; z-index: 100; background: #fff; } .Top003198 .top-search .text { width: calc(320 / 16 * 1em); line-height:48px; height: 48px; color: #999; padding: 0 calc(46 / 16 * 1em) 0 calc(12 / 16 * 1em); background: none; font-size: 1em; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1); } .Top003198 .top-search .btn { position: absolute; right: 0; top: 0; height: 48px; width: 52px; background: url(../images/search-white.svg) no-repeat #155091 center; background-size: auto 40%; } .search-show .Top003198 .top-search { display: block; } .Top003198 .open-search.on:before, .Top003198 .open-search.on:after { background: #2d6c8a; } .Top003198 .top-lang{position: relative; z-index: 999;float: left;margin-right: calc(30 / 16* 1em); padding-bottom: calc(18 / 16* 1em);} .Top003198 .top-lang .cur{padding: 0 22px 0 0;color: #fff;background: url("../images/Top002897-icon_lang.png") no-repeat left center;position: relative;z-index: 1;line-height: 33px;} .Top003198 .top-lang .cur:after{position: absolute; width: 6px; height: 6px; content: '';transform: rotate(135deg);-webkit-transform: rotate(135deg);-ms-transform: rotate(135deg);border-top: 1px solid #fff;border-right: 1px solid #fff; right: 0; top: 50%; margin-top: -3px;} .Top003198 .lang-list{position: absolute; left: 50%; width: 120px;margin-left: -60px; z-index: 999;background: #fff;border-radius: 0 0 5px 5px; top: 100%; padding: 10px 0;display: none;} .Top003198 .lang-list a{display: block;line-height: 30px;text-align: center;} .Top003198 li#m12 .sub .dt_{display:none;} .Top003198 li .prod-sub dt .name h4 a{display: block;} @media (min-width:1025px){ .Top003198 .top-lang:hover .lang-list{display: block;} .Top003198 .logo{display:table;height:calc(70 / 16 * 1em);} .Top003198 .logo a{display:table-cell;vertical-align:middle;} .Top003198 .logo img{max-height:calc(40 / 16 * 1em);} .Top003198 menu li{float:left;margin-right:calc(60 / 1920 * 100vw);position:inherit} .Top003198 menu li span{line-height:calc(70 / 16 * 1em);} .Top003198 menu li span a{color: #fff;} .Top003198 li .sub{position: absolute; top: 100%; background-color:#fff;width: 154px; padding: calc(10 / 16 * 1em); box-shadow: 0 5px 5px rgba(0,0,0,0.1); transform: translate(-50%, 0); left: 50%; margin: 0;} .Top003198 li .sub dl{background: none;} .Top003198 li .sub dt{text-align: center;line-height: 1.5;padding:5px 0} .Top003198 li .sub .sub-intro{ max-width: 1400px; margin: 0 auto;} .Top003198 li .sub .sub-left{float: left;width: 65%;} .Top003198 li .sub .sub-right{float: right;width: 30%;} .Top003198 li .prod-sub {left: 0!important;width: 100%!important;margin-left: 0!important;transform: translate(0, 0);background: rgba(243, 246, 250, 0.98);padding: calc(40 / 1920 * 100vw) 0 } .Top003198 li .prod-sub dl{text-align: center; padding: 0; display: flex;flex-wrap: wrap;} .Top003198 li .prod-sub dt{float: left; text-align: left; width: 30%;margin-bottom:calc(30 / 1920 * 100vw) } .Top003198 li .prod-sub dt:not(:nth-child(3n)){margin-right: 4%} .Top003198 li .prod-sub dt .name{border-bottom: 1px solid rgba(0, 0, 0, 0.08);margin-bottom:calc(10 / 1920 * 100vw);position: relative;margin-right: calc(20 / 16 * 1em); } .Top003198 li .prod-sub dt .name::after {position: absolute;top: 50%;right: 0px;content: '';width: calc(10 / 16 * 1em);height: calc(10 / 16 * 1em);transform: rotate(45deg);border-top: 2px solid rgba(0, 0, 0, 0.1);border-right: 2px solid rgba(0, 0, 0, 0.1);margin-left: calc(18 / 16 * 1em); margin-top: calc(-12 / 16 * 1em);} .Top003198 li .prod-sub dt .name h4{color: #333;font-size: calc(18 / 16 * 1em);font-weight: normal;margin: 0;padding-bottom: calc(10 / 18 * 1em)} .Top003198 li .prod-sub dt .name h4 a{color: #333;} .Top003198 li .prod-sub dt .name:hover h4 a{color: #155091;} .Top003198 li .prod-sub dt .name:hover::after{ border-color: #155091;} .Top003198 li .prod-sub dt .tab-label{line-height: 2; } .Top003198 li .prod-sub dt .tab-label a{color: #949494;line-height:calc(26 / 16 * 1em); padding:calc(8 / 16 * 1em) calc(15 / 16* 1em) calc(8 / 16 * 1em) 0; display:inline-block;font-size:calc(16 / 16 * 1em); border-bottom: 1px solid rgba(0, 0, 0, 0.08); word-break: break-all;} .Top003198 li .prod-sub dt a:hover{color: #155091;} .Top003198 li .sub .sub-right .pic {display: block;border-radius: 10px; padding-bottom: 67.86%;} .Top003198 li .sub.prod-100 .sub-left{float: none;width: 100%;} .Top003198 li .prod-sub.prod-100 dt{width: 16%;} .Top003198 li .prod-sub.prod-100 dt:not(:nth-child(5n)){margin-right: 4%} .Top003198 .top-right{padding-top:calc(18 / 16 * 1em);} .Top003198 .top-right dd{float:left;font-size:calc(16 / 16 * 1em);line-height:calc(43 / 18 * 1em);} .Top003198 .top-search .box{width:calc(90 / 16 * 1em);border-radius:calc(70 / 16 * 1em);transition:0.3s;} .Top003198 .top-search.show .box{width:calc(180 / 1920 * 100vw);} .Top003198 .top-search .box .btn{left:0;} } .Top003198 dl a:hover{color:#155091;} @media (max-width:1024px){ .Top003198{padding:15px 0;} .Top003198 .logo{float:left;width:40%;} .Top003198 .top-right{float:right;width:auto;margin-top:calc(8 / 16 * 1em)} .Top003198 .top-lang{padding-bottom: 0;margin-right: calc(12 / 16* 1em);} .Top003198 .top-hotline,.Top003198 header:after{display:none;} .Top003198 header{display:flex;justify-content:space-between;align-items:center;height:calc(70 / 16 * 1em);} .Top003198 .logo img{max-height:calc(44 / 16 * 1em);} .Top003198 menu{position:fixed;left:-100%;top:calc(62 / 16 * 1em);height:calc(100% - (62 / 16 * 1em));background-color:#f8f8f8;opacity:0;transition:0.5s;box-shadow:0 5px 5px rgba(0,0,0,0.1);width:50vw;max-width:240px;} .menu-show .Top003198 menu{left:0;opacity:1;} .Top003198 menu ul{height:100%;overflow:auto;} .Top003198 menu li{border-bottom:1px dotted #eee;} .Top003198 menu li span{line-height:2.5;padding-left:20px;font-size:calc(18 / 16 * 1em)} .Top003198 menu li.has-sub span .op:before,.Top003198 menu li.has-sub span .op:after{background-color:#155091;} .Top003198 li .sub{background-color:#eee;} .Top003198 li .sub .pic{display:none;} .Top003198 li .sub dt h4{margin:8px 0;} .Top003198 .top-search{/* margin:0 15px 0; */padding-right: 2vw;} .Top003198 .top-search .box{top:100%;left:0;width:100%;opacity:1;position:absolute;display:none;background-color:rgba(255,255,255,1);border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb} .Top003198 .top-search .box .btn{right:0;} .Top003198 .top-search .box .text{padding:0 calc(42 / 16 * 1em) 0 calc(20 / 16 * 1em);} .Top003198 .top-right dl:after{display:none;} .Top003198 .top-right dl{display:flex;align-items:center;} .Top003198 .open-search{width:calc(24 / 16 * 1em);height:calc(24 / 16 * 1em);background:url(../images/search_white.svg) no-repeat center center;background-size:1.125em auto;display:block;position:relative;} .Top003198 .open-search.on:after,.Top003198 .open-search.on:before{background-color:#fff;} .Top003198 .open-menu{width:calc(30 / 16 * 1em);height:calc(20 / 16 * 1em);display:flex;flex-wrap:wrap;flex-direction:column;justify-content:space-between;transition:0.3s; margin-left: 1.125em;} .Top003198 .open-menu span{display:block;transition:0.3s;height:2px;background-color:#fff;} .menu-show .Top003198 .open-menu{border-radius:50%;background-color:#fff;padding:calc(9 / 16 * 1em);height:calc(30 / 16 * 1em);} .menu-show .Top003198 .open-menu span{background-color:#155091;height:1px;} .Top003198 .sub-left{font-size: 1em;padding: 0 4px;} .Top003198 .sub-left .txt{text-align: left;} .Top003198 .open-search.on:before, .Top003198 .open-search.on:after{height: 2px; margin-top: -1px; width:100%; left: 0;} } @media (max-width:640px){ .Top003198 .top-right{float:right;width:auto;margin-top:0;} } /*Banner003008 */ .Banner003008{position: relative; z-index: 1; padding: 0; background:url(../images/banner-bg.jpg) no-repeat center; overflow: hidden; background-size: cover;} .Banner003008 .auto{max-width:100%;} .Banner003008 .slick-list{overflow: inherit;} .Banner003008 li.slick-slide{margin: 0; position: relative;overflow: hidden;background: #000; } .Banner003008 li.slick-slide a{ display: block; position: relative;} .Banner003008 li.slick-slide .pic img{ width: 100%;} /* .Banner003008 li.slick-slide a{position: absolute; display: block; width: 100%; height: 100%; left: 0; top: 0;} */ .Banner003008 li .Ispic{display: block; width: 100%; padding-bottom:31.25%; transition: .3s;} .Banner003008 li:hover .Ispic{transform: scale(1.1); opacity: 0.8;} .Banner003008 li .txt{position: absolute; left: 0; top: 0; width: 100%; z-index: 10; text-align: center;color: #fff;height: 100%; background: rgba(0, 0, 0, 0.2);} .Banner003008 li .txt .ytable{height: 100%;max-width: 1300px; margin: 0 auto;} .Banner003008 li .txt aside{font-size: 3.645vw; letter-spacing: 0.3em;} .Banner003008 li .txt .play{background: url("../images/Banner003008_play.png") no-repeat;background-size: contain; width:60px; height: 60px; display: block; margin:2vw auto 0 auto; cursor: pointer;} @media(max-width:640px){ .Banner003008 li .txt .play{width: 10vw; height: 10vw;background-size: contain;} .Banner003008 li .Ispic{padding-bottom: 41.666%;} } .Banner003008 .pages, .Banner003008 .slick-arrow{position: absolute; z-index: 10; font-size: 1em;} .Banner003008 .pages{ left:50%; transform: translateX(-50%); color: #fff; font-size: calc(20 / 16 * 1em); line-height: 1; bottom: 15px;} .Banner003008 .pages span{display: inline-block; padding: 0 8px; } .Banner003008 .slick-arrow{right:calc(50% - 70px);border-right: 3px solid #fff; border-top: 3px solid #fff;bottom:17px; transform: rotate(45deg); width:calc(15 / 16 * 1em); height:calc(15 / 16 * 1em); line-height: 1000; overflow: hidden;;} .Banner003008 .slick-prev{transform: rotate(-135deg); left:calc(50% - 70px);} .video-box{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:300; background:rgba(0,0,0,0.85);} .video-box .close{ cursor:pointer; width:40px; height:40px; position:absolute; z-index:4; right:20px; top: 20px;} .video-box .close::before, .video-box .close::after{ position:absolute; content:''; width:80%; left:10%; height:3px; top:50%; margin-top:-1.5px; background:#fff; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);} .video-box .close::before{ transform:rotate(45deg);-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);} .video-box .ytable{height: 100%;} .video-box .ytable-cell{ text-align:center;} .video-box .inside{width:100%; position: relative; margin: 0 auto;} .video-box video{ display: block;width: 100%;} /* banner */ .Floor003155 .slider-banner { position: relative; z-index: 1; overflow: hidden; } .Floor003155 .slider-banner li.slick-slide { position: relative; overflow: hidden; } .Floor003155 .slider-banner li.slick-slide video { position: absolute; z-index: 10; left: 50%; top: 50%; transform: translate(-50%, -50%); min-height: 100%; min-width: 100%; } .Floor003155 .slider-banner .txt { position: absolute; left: 0; top: 0; width: 100%; z-index: 20; color: #fff;} .Floor003155 .slider-banner .txt, .Floor003155 .slider-banner .ytable { height: 100%; } .Floor003155 .slider-banner .txt .tit { font-size: 5em; line-height: 1.25; } .Floor003155 .slider-banner .txt .desc { font-size: 2.25em; line-height: 1.5555; margin-bottom: 6.482vh; transition-delay: 0.3s; } .Floor003155 .slider-banner .txt .btn{margin-top: 2vw} .Floor003155 .slider-banner .txt .btn a{ display: inline-block;color: #fff; transition: 0.5s; line-height: 3.5; padding: 0 1em; min-width: 11.25em; text-align: center;font-size: 0.875em;margin-right: 20px;background: #ac1e2a} .Floor003155 .slider-banner .txt .btn a:after { display: inline-block; content: ''; width: 0.5em; height: 0.5em; transform: rotate(45deg); border-top: 2px solid #fff; border-right: 2px solid #fff; margin-left: 1.25em; vertical-align: middle; } .Floor003155 .slider-banner .txt .btn a:hover{ background: #ac1e2a;} .Floor003155 .slider-banner .txt .ytable-cell > * { opacity: 0; transform: translateX(50px); transition-duration: 1s; transition-property: all; } .Floor003155 .slider-banner .ani-show .txt .ytable-cell > * { opacity: 1; transform: translateX(0); } .Floor003155 .slider-banner .Ispic { height: 100vh; width: 100vw; } .Floor003155 .slider-banner .ani-show .Ispic { } .Floor003155 .slider-banner .slick-pages { position: absolute; right: 3.125em; bottom: 5%; color: #fff; z-index: 20; } .Floor003155 .slider-banner .slick-pages #cur { font-size: 3em; } .Floor003155 .slider-banner .slick-arrow { display: inline-block; width: 12px; height: 12px; border-top: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); margin: 0 21px; } .Floor003155 .slider-banner .slick-prev { transform: rotate(-135deg); } .Floor003155 .slider-banner .slick-dots { position: absolute; left: 50%; transform: translateX(-50%); z-index: 20; bottom: 2.55vw; } .Floor003155 .slider-banner .slick-dots li { float: left; width: 30px; position: relative; height: 30px; background: rgba(255,255,255,0); border-radius: 50%; } .Floor003155 .slider-banner .slick-dots li button { font-size: 0; width: 8px; height: 8px; border-radius: 50%; background: #fff; opacity: 0.5; padding: 0; border: 0; position: absolute; left: 50%; top: 50%; margin: -4px 0 0 -4px; } .Floor003155 .slider-banner .slick-dots li:not(:last-child) { margin-right: 4.74vw; } .Floor003155 .slider-banner .slick-dots li:not(:last-child):after { left: 100%; margin-left: 0.34vw; width: 4.07vw; height: 2px; position: absolute; content: ''; top: 50%; margin-top: -1px; background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.5) 20%, transparent 50%); background-size: 8px 2px; background-repeat: repeat-x; } .Floor003155 .slider-banner .slick-dots li.slick-active { background: rgba(255,255,255,0.15); } .Floor003155 .slider-banner .slick-dots li.slick-active button { opacity: 1; } @media (min-width:1201px) { .Floor003155 .slider-banner { } } @media (min-width:1025px) { .Floor003155 .slider-banner .wap { display: none; } } @media(max-width:1024px) { .Floor003155 .slider-banner .pc { display: none; } .Floor003155 .slider-banner .txt .tit { font-size: 3em; } .Floor003155 .slider-banner .txt .desc { margin-bottom: 2em; } .Floor003155 .slider-banner li.slick-slide video { left: -100%; top: 100%; opacity: 0; } .Floor003155 .slider-banner li.slick-slide .open-video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3) url(../images/play.png) no-repeat center center; background-size: auto 60px; z-index: 20; } .Floor003155 .slider-banner li.video-show .open-video { left: -100%; opacity: 0; transform: translateX(-100%); } .Floor003155 .slider-banner li.video-show video { left: 50%; top: 50%; opacity: 1; } } /* product */ .Floor003155 #home-product { position: relative; z-index: 1; background: url(../images/bg1.jpg) no-repeat right bottom; background-size: cover; padding: 4% 0;} .Floor003155 #home-product .auto{ position: relative;} .Floor003155 #home-product .Hometitle{position: absolute;left: 0;top: 2em;} .Floor003155 #home-product .slick-dots{overflow: hidden; margin-top: calc(40 / 16 * 1em);} .Floor003155 #home-product .slick-dots li{float: left;width: calc(92% / 8);list-style: none;text-align: center;} .Floor003155 #home-product .slick-dots li:not(:nth-child(8n)){margin-right: 1%;} .Floor003155 #home-product .slick-dots li:before{display: block;margin: 0 auto;border: 8px solid transparent;border-top: 0; content: '';font-size: 0;width: 0;} .Floor003155 #home-product .slick-dots li.slick-active:before{border-bottom-color: #155091;} .Floor003155 #home-product .slick-dots li div:before{height: 3px;border-bottom: 1px solid rgba(0,0,0,0.1);display: block;content: '';} .Floor003155 #home-product .slick-dots li.slick-active div:before{background-color: #155091;} .Floor003155 #home-product .slick-dots li .icon{padding-top: 38px;} .Floor003155 #home-product .slick-dots li .icon img{height: 24px;} .Floor003155 #home-product .slick-dots li .tit{margin-top: calc(20 / 17 * 1em);font-size: calc(17 / 16 * 1em);color: #333} .Floor003155 #home-product .slick-dots li.slick-active .icon .on, .Floor003155 #home-product .slick-dots li:not(.slick-active) .icon .off{display: none;} .Floor003155 #home-product .slick-dots li.slick-active .tit{color: #155091;} .Floor003155 #home-product .item .pic{width: 80%;margin: 0 auto;background-size: 52.174% auto;} .Floor003155 #home-product .item .Ispic{padding-bottom: 68%;background-size: contain;} .Floor003155 #home-product .item .tit aside{font-size: calc(32 / 16 * 1em);color: #333;position: relative;font-family: 'HarmonyOS_Sans_SC_Medium';} .Floor003155 #home-product .item .tit p{margin: 1.875em 0 3.125em 0;line-height: 1.8;color: #666;font-size: calc(16 / 16 * 1em)} @media (min-width:1025px) { .Floor003155 #home-product .slider{} .Floor003155 #home-product .item .tit{padding-top: 4em;} } @media (max-width:1024px) { .Floor003155 #home-product .Hometitle{position: inherit;top: 0;} .Floor003155 #home-product .item .tit aside{ font-size: calc(24 / 16 * 1em);} .Floor003155 #home-product .item .tit p{margin: calc(20 / 18 * 1em) 0 calc(30 / 18 * 1em);} } @media (min-width:641px) { .Floor003155 #home-product .item .ytable{table-layout: fixed;} .Floor003155 #home-product .item .img{width: 59.8%;} .Floor003155 #home-product .item .txt{padding-right: 5%;} } @media (max-width:640px) { .Floor003155 #home-product{font-size: 3.5vw; padding: 10% 0;} .Floor003155 #home-product .item .ytable, .Floor003155 #home-product .item .ytable-cell{display: block;} .Floor003155 #home-product .item .pic{padding-bottom: 1vw;width: 90%;} .Floor003155 #home-product .slick-dots li .tit{display: none;} .Floor003155 #home-product .item .txt{padding: 5% 0;} .Floor003155 #home-product .slick-dots li .icon{padding-top: 3vw;} .Floor003155 #home-product .slick-dots li .icon img{height: 5vw;} .Floor003155 #home-product .slick-dots li:before{border-width: 4px;} .Floor003155 #home-product .slick-dots li div:before{height: 2px;} } /*Floor003106*/ .Floor003106{ } .Floor003106 .list{position: relative;z-index: 1;} .Floor003106 .bg-img{position: relative;} .Floor003106 .main .slider li{text-align: center; padding:0 2px; color: #fff; cursor: pointer;margin:0 5px 10px 5px;} .Floor003106 .main .slider .slick-slide .con{background: rgba(255,255,255,0.2); padding:calc(20 / 16 * 1em) 1vw; border-radius:calc(10 / 16 * 1em);} .Floor003106 .main .slider .slick-slide .icon{position: relative;display: inline-block; margin-right:calc(10 / 16 * 1em); vertical-align: middle; width: calc(34 / 16 * 1em); height:calc(34 / 16 * 1em);} .Floor003106 .main .slider .slick-slide .icon img{display: block; max-width:calc(36 / 16 * 1em); opacity: 0.8; position: absolute; left:50%; top: 50%; transform: translate(-50%,-50%);} .Floor003106 .main .slider .slick-slide .name{font-size:calc(18 / 16 * 1em); display: inline-block; vertical-align: middle; color: #fff;} .Floor003106 .main .slider li:hover .con, .Floor003106 .main .slider li.slick-current .con{background: #155091;} .Floor003106 .main .slider li .xz-on{background: #155091;} .Floor003106 .main .slider li.slick-current .icon img, .Floor003106 .main .slider li:hover .icon img{opacity: 1;} .Floor003106 .main .slider li.slick-current .name, .Floor003106 .main .slider li:hover .name{font-weight: bold;} .Floor003106 .tit{font-size:calc(30 / 16 * 1em); line-height: 1; color: #fff;font-family: 'HarmonyOS_Sans_SC_Medium';} .Floor003106 .txt{line-height: 1.8; margin:1.5vw 0 3vw;} .Floor003106 .txt p{margin: 0; color:rgba(255,255,255,0.85);} .Floor003106 .txt p+p{margin-top:calc(15 / 16 * 1em); } .Floor003106 .slick-arrow{width: 56px;height:56px; position: absolute; top: 50%; margin-top: -28px; background:none; transition: 0.3s; } .Floor003106 .slick-arrow:before{position: absolute; content: ''; width:20px; height:20px; transform: rotate(45deg);border-top: 2px solid #fff;border-right: 2px solid #fff; left: 50%; top: 50%; margin: -10px 0 0 -12px;} .Floor003106 .slick-prev{left:-60px; transform: rotate(-180deg); } .Floor003106 .slick-next{right:-60px;} .Floor003106 .slick-arrow:hover:before{border-color: #ac1e2a;} .Floor003106 .txt-area{margin: 0 auto;} .Floor003106 .bg-img .Ispic{height:800px; position: relative; z-index: 1;} .Floor003106 .draggable{margin: 0 -10px;} @media (min-width:1025px) { .Floor003106 .title{position:relative;z-index: 2;padding-top: 120px;} /* .Floor003106 .Hometitle{position: absolute;left: 0; top:0;color: #fff; width: 100%;} */ .Floor003106 .main{position: absolute; bottom: 3%; left: 0; width: 100%; z-index:20;} .Floor003106 .main .slider li .icon{display: inline-block; margin-right:calc(10 / 16 * 1em); vertical-align: middle;} .Floor003106 .txt-area{position: absolute; left: 0; top:42%; width: 100%; transform: translateY(-50%);z-index:10;} .Floor003106 .bg-img .Ispic{/* height:100vh; */} .Floor003106 .bg-img .Ispic::before{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); content: '';} .Floor003106 .txt{ width:40%;} .Floor003106 .Homemore a:not(:hover){color: #fff; border-color:#fff; background-image:url(../images/more-on.svg) ;} .Floor003106 .Homemore a:hover{background-color: #7e192b; border-color: #7e192b;} } @media (max-width:1024px) { .Floor003106 .main .slider li{margin-bottom: 0px;} .Floor003106 br{display:none;} .Floor003106 .Hometitle .cn{ color: #fff;} .Floor003106 .Hometitle .en {color: #0a2378;display: none;} .Floor003106 .main {position: absolute;bottom: 0;left: 0;z-index: 99;width: 100%;overflow: hidden;} .Floor003106 {padding:0;} .Floor003106 .txt-area{position: absolute;left: 0;top: 50%;width: 100%;transform: translateY(-50%);z-index:10;} .Floor003106 .bg-img .Ispic::before {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.25);content: '';} .Floor003106 .main .slider .slick-slide >div{margin-bottom: 10px;margin-right: 5px;margin-left: 5px;} .Floor003106 .main .slider .slick-slide .con{padding:10px 5px;border-radius: 10px 10px 0 0;display: flex;align-items: center;} .Floor003106 .main .slider .slick-slide .name{font-size: 15px;} .Floor003106 .main .slider .slick-slide .icon img{max-height:30px;max-width:30px;} .Floor003106 .main .slider .slick-slide .icon{width:35px;height:35px;margin-right:10px;} .Floor003106 .bg-img .Ispic{height:auto;padding-top:40em;} .Floor003106 .draggable{margin: 0 -5px} .Floor003106 .Homemore{margin-bottom: 30px;} } @media (max-width:768px){ .Floor003106 .txt-area{top: 30%;} } /* about */ .Homeabout {position: relative;padding-top: 40px;} .Homeabout-bg{background: url(../images/bg33.jpg) no-repeat right center; background-size: cover;padding: 4% 0 0 0; } .Homeabout .auto{position: relative; z-index: 10;} .Homeabout .title{padding-top: 120px;} /* .Homeabout .Hometitle{position: absolute;top: 0;left: 0;width: 100%;} */ .Homeabout .home-title .cn, .Homeabout .home-title .en{color: #fff} .Homeabout .intro{ width: 92%; max-width: 680px;margin: 3.875em 0 3.125em 0;line-height: 2;color: #fff;font-size: calc(16 / 16 * 1em);} .Homeabout .number{background: rgba(21,80,145,0.75); padding: 3vh 0;/* position: absolute;bottom: 0;left: 0;width: 100%;z-index: 10 */} .Homeabout .number:before{position: absolute;right: 100%; top: 0; height: 100%; width: 100%; content: '';background: rgba(21,80,145,0.9);display: none} .Homeabout .number i.jiao{position: absolute; content: ''; left: 100%; top: 0; border: 10px solid transparent; border-left-color: rgba(21,80,145,0.9);border-bottom-color:rgba(21,80,145,0.9);} .Homeabout .number li{float: left;position: relative;color: #fff;width: 16.6%;text-align: center;padding: 0 0.5vw} .Homeabout .number li .counter{font-size: calc(48 / 16 * 1em);color: #fff; font-weight: bold; margin-right: 8px;} .Homeabout .number li:not(:last-child):before{position: absolute; content: ''; width: 1px; height: 100%;background: #fff; right: 0;top: 0%;opacity: 0.1} @media(min-width:1025px){ .Homeabout .main{width: 50%; } .Homeabout .info{ padding-bottom: 10vh; padding-top: 2vw;} .Homeabout .number li:not(:first-child){} .Homeabout .number li:not(:last-child){} } @media(max-width:1200px){ .Homeabout .info{padding: 8vw 0;} } @media(max-width:1024px){ .Homeabout-bg{background: url(../images/bg33.jpg) no-repeat top center;} .Homeabout{ background-position:center top;} .Homeabout-bg{background: url(../images/bg33.jpg) no-repeat right top; background-size: cover;padding: 4% 0 0 0; } .Homeabout .number{ padding: 2vw 0;} .Homeabout .number ul{ width: 100%;} .Homeabout .intro{width: 100%;margin: 1em 0;} .Homeabout .number li{ width: 33.33%; margin-bottom: 3%;} .Homeabout .number li:not(:first-child){padding-left: 0vw;} .Homeabout .number li:not(:last-child){padding-right: 0vw;} .Homeabout .number li .counter{font-size: calc(30 / 16* 1em);} } @media(max-width:640px){ .Homeabout{padding-top: 25px;} .Homeabout .title{padding-top: 83px;} } /*Floor003196 */ .Floor003196{background: url(../images/bg4.jpg) no-repeat right top; background-size: cover;padding: 4% 0; display: none;} @media (max-width:1024px) { .Floor003196 .box-new-company{ margin-bottom: calc(30 / 16 * 1em);} } .Floor003196 .ytable-cell{ vertical-align: top;} .Floor003196 [class*=box-new-] a:hover{color: #155091;} .Floor003196 [class*=box-new-] h4.tit{margin: 0;font-weight: normal;} .Floor003196 .box-new-industry{background-color: #fff;box-shadow: 0 0px 10px rgba(0,0,0,.03); padding: calc(25 / 16 * 1em);border-radius: 10px;} .Floor003196 a.inner{display: block; background: #fff;border-radius: 10px; overflow: hidden;box-shadow: 0 0px 10px rgba(0,0,0,.03);} .Floor003196 a.inner .txt{ padding:calc(30 / 16 * 1em);} .Floor003196 .label span{display: inline-block; padding: 0 calc(18 / 16 * 1em); text-align: center;color: #155091;line-height: calc(30 / 14 * 1em);border-radius: 50px;border: solid 1px #155091;font-size: calc(14 / 16 * 1em);} .Floor003196 a:hover .label span{color:#fff;border-color: transparent; background:#155091;} .Floor003196 a.inner h4.tit{margin: calc(15 / 20 * 1em) 0 calc(12 / 20 * 1em) 0;font-size: calc(20 / 16 * 1em); line-height:1.5;} .Floor003196 a.inner p{ color: #666; line-height: calc(30 / 16 * 1em); height: calc((30 / 16 * 1em) * 2); margin-bottom: 0;} .Floor003196 a.inner .more{color: #999;display: inline-block; font-size: calc(16 / 16 * 1em); padding-right: calc(25 / 16 * 1em); background: url(../images/more2.svg) no-repeat right center; background-size:calc(14 / 16 * 1em) auto;transition: 0.3s;} .Floor003196 a.inner:hover .more{color: #fff; padding-right:calc(40 / 16 * 1em); background-image:url(../images/more-on.svg) ;} .Floor003196 .box-new-company .pic{overflow: hidden;} .Floor003196 .box-new-company .Ispic{padding-bottom: calc(280 / 460 * 100%); transition: 0.3s;} .Floor003196 a.inner:hover .Ispic{transform: scale(1.1);} .Floor003196 a.inner:hover .label span{color:#fff;border-color: transparent; background:#155091;} .Floor003196 .list{ } .Floor003196 .list li{display: table;width: 100%;border-bottom:1px solid #f5f5f5; height: calc(155 / 16 * 1em); } .Floor003196 .list li a{display: table-cell; vertical-align: middle;} .Floor003196 .list h4.tit{font-size: calc(20 / 16 * 1em); line-height: 1.5; margin:calc(15 / 20 * 1em) 0;} .Floor003196 .list p{ color: #666; line-height: calc(30 / 16 * 1em); margin: 0; margin-bottom: calc(10 / 16 * 1em);/* height: calc((30 / 16 * 1em) * 2); */} .Floor003196 .list li time{color: #999; font-size: calc(15 / 16 * 1em);padding-left: 24px; background: url(../images/icon-time.svg) no-repeat left center; background-size: 16px auto;} .Floor003196 .more-btn{text-align: right;} .Floor003196 .more-btn a{width: calc(120 / 14 * 1em);line-height: calc(43 / 14 * 1em);border-radius: 50px;border: solid 1px #155091;font-size: calc(14 / 16 * 1em);display: inline-block;text-align: center;color: #155091;transition: 0.3s;} .Floor003196 .more-btn a:hover{background-color:#155091;color: #fff;} @media (min-width:1025px) { .Floor003196 .box-new-company{width: calc(490 / 1440 * 100%);} .Floor003196 a.inner{margin-right:calc(40 / 16 * 1em);} } @media (max-width:1024px) { .Floor003196 .column-tit{font-size: calc(32 / 16 * 1em);} } /*Floor002479 */ .Floor002479{padding: 4% 0;background: url(../images/bg5.jpg) no-repeat right top; background-size: cover;} .Floor002479 .inner{background: rgba(255, 255, 255, 0.6);padding: calc(50 / 16 * 1em); border-radius: 10px;} .Floor002479 .title{margin: 0;font-size:calc(30 / 16 * 1em);margin-bottom:calc(25 / 30 * 1em); color: #333;font-weight: bold; } .Floor002479 .ytable-cell {vertical-align: top;} .Floor002479 .form{background-color: #f9f9f9; margin-top: 3.375em;} .Floor002479 .form-ul{margin: 0 auto;} .Floor002479 .form-ul li{margin-bottom: calc(25 / 16 * 1em);position: relative;} .Floor002479 .form-ul li .tit{position: absolute;left: 1.1428em; top: 0;font-size: calc(16 / 16 * 1em); line-height: 3.5714;color: #333333;} .Floor002479 .form-ul li select, .Floor002479 .form-ul li .text{width: 100%;border-radius: 5px; border: none; font-size: calc(16 / 16 * 1em);line-height: 3.5714;height: 3.5714em; background: rgba(255, 255, 255, 0.8);padding: 0 1em;} .Floor002479 .form-ul li textarea.text{height: 120px;} .Floor002479 .form-ul li .text:hover{box-shadow: 0 0 15px rgba(21,80,145,0.08);} .Floor002479 .form-ul .btn{width: 10em; background: #155091;font-size: calc(16 / 16 * 1em);height: 3.5em;color: #fff;cursor: pointer; border: 0;} .Floor002479 .form-ul .btn:hover{ background: #ac1e2a;} .Floor002479 .txtBox li{ padding: calc(12 / 20 * 1em) 0; line-height: 1.7; padding-left: calc(36 / 20 * 1em);background-repeat:no-repeat;background-position: left calc(13 / 20 * 1em); background-size: calc(24 / 20 * 1em) auto; font-size: calc(20 / 16 * 1em);color: #333; } .Floor002479 .txtBox li+li{ border-top: 1px solid #eee;} .Floor002479 .txtBox li span {display: block;color: #999;margin-bottom: 5px;font-size: calc(18 / 20 * 1em);} .Floor002479 .txtBox li.add{background-image:url(../images/icon-add.svg);} .Floor002479 .txtBox li.tel{background-image:url(../images/icon-tel.svg);} .Floor002479 .txtBox li.email{background-image:url(../images/icon-email.svg);} .Floor002479 .txtBox li.fax{background-image:url(../images/icon-fax.svg);} @media(min-width:1025px){ .Floor002479 .FormBox{width:58%;padding-left:calc(50 / 16 * 1em); } .Floor002479 .txtBox{ padding-right:calc(50 / 16 * 1em);border-right: 1px solid #e6e6e6;} .Floor002479 .form-ul .row-2 li{float: left;width:calc(50% - 15px);} .Floor002479 .form-ul .row-2 li:nth-child(2n){float: right;} } @media (max-width:1024px) { .Form003139 .form-ul{padding: 2em 0;} .Form003139 .form-ul{width: 90%;} .Floor002479 .title{font-size: calc(24 / 16* 1em);} .Floor002479 .inner{padding: calc(25 / 16 * 1em); } .Floor002479 .img{ margin-bottom: 1.5em;} } /*Floor002480 */ .Floor002480{padding: 5% 0;} .Floor002480 .inner{} .Floor002480 .ytable-cell {vertical-align: top;} .Floor002480 .form{background-color: #f9f9f9; margin-top: 3.375em;} .Floor002480 .form-ul{margin: 0 auto;} .Floor002480 .form-ul li{margin-bottom: calc(25 / 16 * 1em);position: relative;} .Floor002480 .form-ul li .tit{position: absolute;left: 1.1428em; top: 0;font-size: calc(16 / 16 * 1em); line-height: 3.5714;color: #666;} .Floor002480 .form-ul li select, .Floor002480 .form-ul li .text{width: 100%;border-radius: 5px; border: none; font-size: calc(16 / 16 * 1em);line-height: 3.5714;height: 3.5714em; background:#f8f8f8;padding: 0 1em;} .Floor002480 .form-ul li textarea.text{height: 120px;} .Floor002480 .form-ul li .text:hover{} .Floor002480 .form-ul .btn{width: 10em; background: #155091;font-size: calc(16 / 16 * 1em);height: 3.5em;color: #fff;cursor: pointer; border: 0;} .Floor002480 .form-ul .btn:hover{ background: #ac1e2a;} .Floor002480 .txtBox li{ padding: calc(12 / 20 * 1em) 0; line-height: 1.7; padding-left: calc(36 / 20 * 1em);background-repeat:no-repeat;background-position: left calc(13 / 20 * 1em); background-size: calc(24 / 20 * 1em) auto; font-size: calc(20 / 16 * 1em);color: #333; } .Floor002480 .txtBox li+li{ border-top: 1px solid #eee;} .Floor002480 .txtBox li span {display: block;color: #999;margin-bottom: 5px;font-size: calc(18 / 20 * 1em);} .Floor002480 .txtBox li.add{background-image:url(../images/icon-add.svg);} .Floor002480 .txtBox li.tel{background-image:url(../images/icon-tel.svg);} .Floor002480 .txtBox li.email{background-image:url(../images/icon-email.svg);} .Floor002480 .txtBox li.fax{background-image:url(../images/icon-fax.svg);} @media(min-width:1025px){ .Floor002480 .FormBox{width:58%;padding-left:calc(50 / 16 * 1em); } .Floor002480 .txtBox{ padding-right:calc(50 / 16 * 1em);border-right: 1px solid #e9e9e9;} .Floor002480 .form-ul .row-2 li{float: left;width:calc(50% - 15px);} .Floor002480 .form-ul .row-2 li:nth-child(2n){float: right;} } @media (max-width:1024px) { .Floor002480 .inner{padding: calc(0 / 16 * 1em); } .Floor002480 .img{ margin-bottom: 1.5em;} .Floor002480 .txtBox li{font-size: calc(18 / 16* 1em);} } /*Bottom002900 */ .Bottom002900{background: #f5f5f5;padding: 4% 0 0 0;} .Bottom002900, .Bottom002900 a{color: #333;} .Bottom002900 .b_nav nav dd a{opacity: 0.6;} @media(min-width:1025px){ .Bottom002900 .contact{width: 28%;} .Bottom002900 .b_nav{width: calc(1100 / 1600* 100%);} } .Bottom002900 .b_nav nav{} .Bottom002900 .b_nav nav dl{float: left; max-width: 180px;} .Bottom002900 .b_nav nav dt {font-size: calc(20 / 16 * 1em); position: relative; margin-bottom: calc(20 / 20 * 1em); } .Bottom002900 .b_nav nav dd{line-height: 24px;padding: 5px 0;} @media(max-width:1024px){ .Bottom002900 .b_nav nav{display: none;} } .Bottom002900 .copyright{color: rgba(0,0,0,0.5);line-height: 2;border-top: 1px solid rgba(0, 0, 0, 0.1);padding: calc(20 / 14 * 1em) 0 ;margin-top: calc(30 / 14 * 1em);font-size: calc(14 / 16 * 1em); } .Bottom002900 .copyright a{opacity: 0.5;} .Bottom002900 .copyright .fr a:not(:last-child):after{display: inline-block;content: '';width: 1px;height: 12px;background: rgba(0,0,0,0.4);margin: 0 calc(15 / 16 * 1em);vertical-align: middle;} .Bottom002900 a:hover{color: #155091;opacity: 1!important;} .Bottom002900 .logo img{max-height:calc(60 / 16 * 1em);} .Bottom002900 .contact .num{font-size: calc(24 / 16 * 1em); font-weight: bold; margin-bottom: calc(16 / 36 * 1em);line-height: 1em;color: #155091;} .Bottom002900 .share li{float: left;position: relative;} .Bottom002900 .share li figure{position: absolute; left: 0; bottom: 100%; width: 120px; padding: 5px;background: #fff; margin-bottom: 10px;border-radius: 5px;display: none;} .Bottom002900 .share li figure img{display: block;width: 100%;} .Bottom002900 .share li figure:before{position: absolute; content: '';border:5px solid transparent; left: 20px; top: 100%;border-top-color: #fff;} .Bottom002900 .share li:not(:last-child){margin-right: calc(15 / 16 * 1em);} .Bottom002900 .share li a{display: block;background-color: rgba(0, 0, 0, 0.15); width: calc(45 / 16 * 1em); height: calc(45 / 16 * 1em);background-position: center center;background-repeat: no-repeat; background-size: calc(24 / 16 * 1em) auto; border-radius: 50%; cursor: pointer;} .Bottom002900 .share li a.a_wx{background-image: url("../images/icon-wx.svg");} .Bottom002900 .share li a.a_sina{background-image: url("../images/icon-sina.svg");} .Bottom002900 .share li a.a_douyin{background-image: url("../images/icon-douyin.svg");} .Bottom002900 .share li a:hover{background-color: #155091;} @media(min-width:1025px){ .Bottom002900 .logo{ margin-bottom: calc(26 / 16 * 1em);} .Bottom002900 .contact .tit{padding-bottom: calc(16 / 16 * 1em);} .Bottom002900 .share{margin: calc(32 / 16 * 1em) 0 0 0;} } @media(min-width:1025px) and (max-width:1280px){ .Bottom002900 .share li:not(:last-child){margin-right: 2vw;} } @media(max-width:1024px){ .Bottom002900{text-align: center;} .Bottom002900 .logo{padding: 0 20% 3%;} .Bottom002900 .contact .tit{padding: 3vw 0;} .Bottom002900 .share ul{margin: 0 auto;display: table;} .Bottom002900 .share li figure{left: 50%; margin-left: -60px;} .Bottom002900 .share li figure:before{left: 50%; margin-left: -5px;} } /* 右侧浮动 */ .RightFix{z-index: 1000;box-shadow: 0 8px 18px rgba(0,0,0,0.1);position: fixed;transition: all 0.5s;} .RightFix li{position: relative;cursor: pointer;background: rgba(255, 255, 255, 0.7);} .RightFix .btn{text-align: center;position: relative;padding: calc(10 / 16 * 1em) 0;display: block;color: #333;} .RightFix .ico-zoom{width: 25px;height: 25px;margin: 0px auto;} .RightFix .btn aside{font-size: calc(14 / 16 * 1em);} .RightFix .info{position: absolute;top: 50%;transform: translateY(-50%);padding: calc(12 / 16 * 1em);background: #fff;right: 100%;min-width: calc(180 / 16 * 1em);text-align: center;box-shadow: 0 0 15px rgba(0,0,0,0.1);border-radius: 5px;visibility: hidden;opacity: 0;z-index: -10;transition: all 0.5s;} .RightFix .info .name{font-size: calc(16 / 16 * 1em);} .RightFix .info a{color:#155091;font-size: calc(20 / 16 * 1em); font-weight: bold;} .RightFix .ewm{margin-bottom: 8px;} .RightFix .ewm img{width: calc(120 / 16 * 1em);} .RightFix li:hover{background-color:#155091;} .RightFix li:hover .ico-zoom img{filter: grayscale(100) brightness(100);} .RightFix li:hover .btn{color: #fff;} @media(min-width:1025px){ .RightFix{right: 1%;top: 50%;transform: translateY(-50%);width: calc(52 / 16 * 1em);} .RightFix li:first-child{border-radius: 5px 5px 0 0;} .RightFix li:last-child{border-radius: 0 0 5px 5px;} .RightFix li:not(:last-child){border-bottom: #fff 1px solid;} .RightFix li:first-child:hover{border-radius: calc(10 / 16 * 1em) calc(10 / 16 * 1em) 0 0;} .RightFix li:last-child:hover{border-radius: 0 0 calc(10 / 16 * 1em) calc(10 / 16 * 1em);} .RightFix li:hover .info{right: 110%;visibility: visible;z-index: 10;opacity: 1;} .RightFix li .pcd{display: block} .RightFix li .ydd{display: none} } @media(max-width:1024px){ .Bottom002900{padding-bottom: 60px;} .RightFix{bottom: 2%; left:8%;border-radius: 0;right: 10%;width: 84%;} .RightFix ul{display: flex;justify-content: space-between;background: #155091;} .RightFix li{flex: 1;background: #155091;position: relative} .RightFix .ico{width: 22px;height: 22px;} .RightFix .info{width: 150px;right: 50%;transform: translate(50%,0);top: auto;bottom: calc(50 / 16 * 1em);} .RightFix li:hover .info{bottom: 100%;visibility: visible;z-index: 10;opacity: 1;} .RightFix .totop{display: block !important;} .RightFix li .pcd{display: none} .RightFix li .ydd{display: block} .RightFix li i{width: 1px;height: 60%;display: inline-block;position: absolute;top: 20%;right: 0; background:linear-gradient(to bottom, rgb(255 255 255 / 40%), #fff, rgb(255 255 255 / 40%));} } @media(max-width:768px){ .Bottom002900{padding-bottom: 60px;} .RightFix{bottom: 2%; left:8%;border-radius: 0;right: 10%;width: 84%;} .RightFix ul{display: flex;justify-content: space-between;} .RightFix li{flex: 1;background: #155091;} .RightFix .ico{width: 22px;height: 22px;} .RightFix .info{width: 150px;right: 50%;transform: translate(50%,0);top: auto;bottom: calc(50 / 16 * 1em);} .RightFix li:hover .info{bottom: 100%;visibility: visible;z-index: 10;opacity: 1;} .RightFix .totop{display: block !important;} } .home_box4{padding: 120px 0;/*background: url(../images/bg1.jpg) no-repeat right bottom; background-size: cover;*/} .home_box4 .home_title{float: left;} .home_box4 .h1_tab{display: inline-block;float: right;margin-top: 0;} .home_box4 .h1_tab span{padding: 0 60px;background: #f2f2f2;border-radius: 30px;font-size: 16px;color: #666; line-height: 60px;display: inline-block;} .home_box4 .h1_tab span.on{color: #fff;background: linear-gradient(to right, #94ebf7, #155091)} .home_box4 .info{width: 100%;} .home_box4 ul{margin:0 -20px;display: inline-block;} .home_box4 li{width: 25%;float: left;margin-top: 40px;} .home_box4 .slider li a{color: #333; display: block; margin: 0 20px; padding-bottom:0;border-radius: 0;border: 1px solid #eee;} .home_box4 .slider li .pic{overflow: hidden;border-radius:0;background: #c7d1db;} .home_box4 .slider li .pic img{width: 80%;margin: 8% auto 12% auto;display: block;} .home_box4 .slider li .Ispic{padding-bottom: 73.2%; transition: 0.3s;background-size:cover;background-position: center;background-repeat: no-repeat;} .home_box4 .slider li a:hover .Ispic{transform: scale(1.1);} .home_box4 .slider li .txt{position: relative; z-index: 10;width: 100%;background:#fff; padding: 30px 30px 20px 30px; text-align: left; border-radius:0;} .home_box4 .slider li .txt h2{font-size: 22px;line-height: 1;color: #222;margin: 0 0 30px 0} .home_box4 .slider li .txt p{font-size: 16px;line-height: 1.8;color: #555;width: 100%;margin: 0;} .home_box4 .slider li a:hover .txt {} .home_box4 .slider li a:hover .txt h2{color:#155091;} .home_box4 .slider li a:hover .txt .home_more{color:#155091; } .home_box4 .slider li a:hover .home_more:after{transform: rotate(0);} .home_box4 .slider li .txt pre{line-height: 1.625em; max-height: 3.25em; margin: 1.2vw 0;font-weight: lighter;} .home_box4 .slider li .txt span{font-weight: 100; line-height: 20px;transition: 0.3s;} .home_box4 .controls{position: relative; height: 1px; background: rgba(0,0,0,0.1); margin: 60px 75px 30px 75px;} .home_box4 .controls:before{position: absolute; content: ''; width: 50%; height: 100%; left: 0;background: #155091;} .home_box4 .slick-arrow {z-index: 100;position: absolute;top: 50%;transform: translate(0, -50%);width: 60px;height: 60px; border-radius: 50%;cursor: pointer;padding: 0;transition: all ease 0.3s;color: #fff;border: none; background:url(../images/icon-jt2.svg) #155091;font-size: 0;background-size: 24px auto;background-repeat: no-repeat;background-position: center center;} .home_box4 .slick-prev:before {background-image: url(../images/icon-jt1.svg);filter: grayscale(100) brightness(100);} .home_box4 .slick-prev{left: -66px;transform: rotate(180deg) translate(0, 50%)} .home_box4 .slick-next{right: -66px;} @media(min-width:1025px){ .home_box4_title{display: inline-block;align-items: center;justify-content: space-between;width: 100%;} .home_box4_title .home_more{margin-top: 0;} } @media(max-width:1024px){ .home_box4 .slider li a{padding-bottom: 5vw;} .home_box4 .slider li .txt aside.dot2{font-size: 4.5vw;} .home_box4 .slider li .txt pre{font-size: 3.5vw; margin: 4vw 0;} .home_box4 .slider li .txt{margin-top: -10vw;} .home_box4 .controls{margin-left: 40px;margin-right: 40px;} .home_box4 .slick-arrow{width: 30px; height: 30px;margin-top: -15px;} .home_box4 .slick-prev{left: -40px;} .home_box4 .slick-next{right: -40px;} } .home_box4 .home_more{display:block;width: 100%;border-top: 1px solid #eee;justify-content:left;align-items: center;padding-top: 20px;margin-top:30px;transition: .3s all} .home_box4 .home_more span{color: #155091;transition: .3s all;} .home_box4 .home_more:after{content: '';width: 26px;height: 26px;background: url(../images/icon-jt1.svg)no-repeat center; background-size: 18px auto;margin-left: 22px;transform: rotate(0deg);transition: .3s all;float: right;} /*.PicList002797*/ .PicList002797 {padding:0 0 3%;width: 100%;} .PicList002797 .RighInfo003134{padding-top: 0; padding-bottom: calc(60 / 16 * 1em);} .PicList002797 .RighInfo003134 .img-side .btn a.download:before{display: none;} .PicList002797 .RighInfo003134 .img-side .txt{padding-left: 0; padding-top: 0;} .PicList002797 li {float: left;width:23.5%;margin:2% 2% 0 0;border: 1px solid #e8e8e8;border-radius: 10px;background: rgb(255 255 255 / 52%)} .PicList002797 li:nth-child(4n) {margin-right: 0;} .PicList002797 li a {display: block;position: relative;padding:0 0 0 0;text-align: center;} .PicList002797 li h4,.PicList002797 li h3,.PicList002797 li h5 {margin: 0;text-align: center;font-weight: normal;} .PicList002797 li figure {padding-bottom: 80%;margin-bottom: 8%;background-size: contain;}.PicList002797 li h4 {font-size: 14px;color: #999;margin-bottom: 10px;display: none;} .PicList002797 li h3 {font-size: 18px;color: #fff;line-height: 30px;background: #155091;border-radius:0 0 10px 10px; padding: 10px 15px;display: block;} .PicList002797 li .hover {opacity: 0;position: absolute;left: 0;top: 0;right: 0;bottom: 0;text-align: center; background: rgb(21 80 145 / 100%);z-index: 10;transition: 0.3s;color: #fff;} .PicList002797 li:hover {box-shadow: 0 0 15px 3px #ccc;border-color: #155091;overflow: hidden;} .PicList002797 li:hover a .hover {opacity: 1;} .PicList002797 li .content{ display: none;} .PicList002797 li aside {position: absolute;left: 10%;width: 80%;top: 50%;-ms-transform: translateY(-50%); -webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);transform: translateY(-50%);} .PicList002797 li .hover h5 {font-size: 24px;}.PicList002797 li .hover i {display: block;height: 2px;background: #fff;width: 48px;margin: 14px auto 20px;} .PicList002797 li .hover p {font-size: 16px;line-height: 1.8;margin: 0;max-height: 90px;overflow: hidden;} .PicList002797 .more {display: block;text-align: center;margin-top: 50px;} .PicList002797 .more span {display: inline-block;padding-left: 50px;padding-right: 74px;line-height: 40px;font-size: 16px; background: url(../images/PicList002797-more.png) no-repeat 74% center #008be5;border-radius: 5px;transition: all 0.5s ease-out 0s;} .PicList002797 .more span:hover {padding-left: 50px;padding-right: 74px;} @media(max-width:1000px) { .PicList002797 li {width: 48%;margin-right: 4%;margin-top: 4%;} .PicList002797 li:nth-child(2n){margin-right: 0;} .PicList002797 li .hover i{margin: 10px auto 10px auto;} .PicList002797 li .hover p{display: -webkit-box;-webkit-line-clamp: 2;overflow: hidden; text-overflow: ellipsis;word-break: break-word;-webkit-box-orient: vertical;max-height: 52px;} .PicList002797 .more{margin-top: 10px;} .PicList002797 .more span{padding-left: 20px;padding-right: 56px;line-height: 30px;} .PicList002797 .more span:hover {padding-left: 20px;padding-right: 56px;} } @media(max-width:640px) and (min-width:376px) { .PicList002797 li .hover img {width: 50px;height: 50px;} .PicList002797 li h3{padding:5px 15px;line-height: 1.6} } @media(max-width:480px) { .PicList002797 li {float: none;width: 48%;float: left;margin-right: 4%;margin-top: 4%;} .PicList002797 li:nth-child(2n){margin-right: 0;} .PicList002797 li h3{padding:5px 15px;line-height: 1.6} .PicList002797 li h3,.PicList002797 li .hover h5 {font-size: 16px;} .PicList002797 li .hover h5 {line-height: 20px;max-height: 40px;} .PicList002797 li .hover p{font-size: 14px;max-height: 48px;line-height: 1.8;} .PicList002797 .more span{padding-left: 20px;padding-right: 46px;line-height: 30px;} .PicList002797 .more span:hover {padding-left: 20px;padding-right: 46px;} } /*Banner002922 */ .Banner002922 {width: 100%;position: relative;} .Banner002922 .Ispic {height: 240px;} @media(min-width:1025px){ .Banner002922 .Ispic {height:240px;} } @media(max-width:1024px){ .Banner002922 .Ispic {height: 140px;background-position: 22% center;background-size: cover;} } /*Menu002518 */ .Menu002518{width:300px;float: left;border-radius: 15px;overflow: hidden;} .Menu002518 .side-title{ background:#155091; background-size: contain; color:#fff; font-size:24px; letter-spacing: 2px; padding:15px 0 15px 40px; font-weight:bold;} .Menu002518 .side-title span{ display:block; opacity:0.5; font-size:14px;font-weight: 500;letter-spacing: 1px;} .Menu002518 .side-menu{ background:#f7f7f7; border-radius:0; padding:0 0 4% 0;} .Menu002518 .side-menu li{ margin-bottom:2px;} .Menu002518 .side-menu li a{display:block; font-size:16px; position:relative; color:#222;} .Menu002518 .side-menu > ul > li span{ line-height:60px;margin-right: 30px; border-radius:0; margin-left: 30px; font-weight:500; font-size:18px; border-bottom: 1px dashed #ddd;position: relative; display: block;} .Menu002518 .side-menu > ul > li span a{ display: inline-block; padding-left:20px; font-weight: bold;} .Menu002518 .side-menu li a i{ position:absolute; left:0; top:44%; margin-top:-8px; width:12px; height:12px; background:#f1f1f1; border-radius:50%;} .Menu002518 .side-menu li a i::before, .Menu002518 .side-menu li a i::after{ position:absolute; content:''; } .Menu002518 .side-menu li a i::before{ display: inline-block; content: ''; border: 6px solid transparent; border-left-color: #555; margin-right: 4px;position: absolute;top: 40%;left: 0; } .Menu002518 .side-menu li a i::after{ display: inline-block; content: ''; border: 6px solid transparent; border-left-color: #555; margin-right: 4px;position: absolute;top: 40%;left: 0;} .Menu002518 .side-menu li ul{ display:none;} .Menu002518 .side-menu > ul > li span a:hover, .Menu002518 .side-menu > ul > li.aon span a{ color: #155091;} .Menu002518 .side-menu li a:hover{ color:#fff; font-weight:500;} .Menu002518 .side-menu li.aon span a{color:#fff; } .Menu002518 .side-menu li li.aon a{color:#155091; font-weight:500;border-radius: 0; opacity: 1;} .Menu002518 .side-menu li li.aon a:hover{color:#155091; opacity: 1;} .Menu002518 .side-menu li li a:hover{color:#155091; opacity: 1;} .Menu002518 .side-menu li a:hover i::before{ border-left-color:#155091; } .Menu002518 .side-menu li.aon a i::before{ border-left-color:#155091;transform: rotate(90deg);top: 52%;} .Menu002518 .side-menu li a:hover i::after, .Menu002518 .side-menu li.aon a i::after{ display:none;} .Menu002518 .side-menu li ul { padding:2px 0 0 0;border-bottom: 1px dashed #ddd;margin-left: 30px;padding: 10px 0;margin-right: 30px;} .Menu002518 .side-menu li ul li{padding-left:0; } .Menu002518 .side-menu li ul li a{ line-height:44px; position:relative;padding-left: 30px; font-size: 14px; opacity: .7; font-weight: normal;} .Menu002518 .side-menu li ul li:last-child a{ border-bottom:0;} .Menu002518 .side-menu li ul li a::before, .Menu002518 .side-menu li ul li a::after{ position:absolute; content:''; opacity:0;display: none;} .Menu002518 .side-menu li ul li a::before{ right:34px; top:50%; width:15px; height:15px; margin-top:-7.5px; display: none; background:#fff; border-radius:50%;} .Menu002518 .side-menu li ul li a::after{ border-color:transparent; border-width:3px 0 3px 4px; border-style:solid; border-left-color:#fff; right:39px; top:50%; margin-top:-3px;} .Menu002518 .side-menu li ul li a:hover::before, .Menu002518 .side-menu li ul li a:hover::after, .Menu002518 .side-menu li ul li.aon a::before, .Menu002518 .side-menu li ul li.aon a::after{ opacity:1;} @media(min-width:1025px){ .Menu002518 .side-open_menu{ display:none;} } @media(max-width:1024px){ .Menu002518{ position:relative; z-index:10;} .Menu002518 .side-menu{ display:none; position:absolute; left:0; width:100%; top:100%; margin-top:5px; z-index:100;} .Menu002518 .side-open_menu{ position:relative; background:rgba(226, 16, 19, 0.1); border:3px solid #fff;border-radius:6px; padding:10px 20px; font-size:18px; box-shadow:0 3px 0 #155091;white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .Menu002518 .side-open_menu::before{ position:absolute; content:''; border:5px solid transparent; border-top-color:#155091; right:20px; top:50%; margin-top:-2px;} } @media(max-width:480px){ .Menu002518 .side-menu > ul > li > a {line-height: 40px;padding-left: 20px;font-size: 16px;} .Menu002518 .side-menu li ul li a {line-height: 36px;} .Menu002518 .side-menu li a{ font-size:14px;} .Menu002518 .side-menu{ padding-top:10px;} } /* .product_box */ .product_box .auto{margin: 0 auto;padding: calc(40 / 16 * 1em) 0 0 0;} .product_box .PicList002797{padding: 0 0 calc(60 / 16 * 1em) 0;width: calc(100% - 300px);float: left;padding-left: 30px;font-size: 16px;} .product_box .PicList002797 li{width: 31.73%;margin: 0 2.4% 2.4% 0;} .product_box .PicList002797 li:nth-child(3n){margin-right: 0;} .product_box .rightBox{padding: 0 0 calc(60 / 16 * 1em) 0;width: calc(100% - 300px);float: left;padding-left: 30px;} .product_box .rightBox .RighInfo003134{ padding-top: 0;} .product_box .rightBox .RighInfo003134-1{ background-color: transparent;} .product_box .rightBox .RighInfo003134 .img-group{ display: none;} @media(max-width:1024px){ .product_box .auto{margin: 0 auto;padding: calc(20 / 16 * 1em) 0 0 0;} .product_box .Menu002518{display: none;} .product_box .rightBox, .product_box .PicList002797{width: 100%;padding: 0;font-size: 16px;} .product_box .PicList002797 li{width: 46%;margin: 0 2% 4% 2%;} .product_box .PicList002797 li:nth-child(3n){margin-right: 2%;} } .Page002623 {padding: calc(0 / 16 * 1em) 0 calc(120 / 16 * 1em) 330px; text-align: center;} .Page002623_2{padding: 0 0 calc(100 / 16 * 1em) 0;} .Page002623 .Pages a.a_first, .Page002623 .Pages a.a_end, .Page002623 .Pages > span:not(.p_page) { display: none; } .Page002623 .Pages em { float: left; margin: 0 1vw; font-style: normal; } .Page002623 .Pages .p_page { display: table; margin: 0 auto; } .Page002623 .Pages a { float: left; line-height: 48px; width: 50px;font-size: 16px; border-radius: 50%; margin: 0 5px; border: 1px solid #ededed; transition: .3s; } .Page002623 .Pages a.a_cur, .Page002623 .Pages a:hover { color: #fff; background: #155091; border-color: #155091; } .Page002623 .Pages .p_page > a { font-size: 0; height: 50px; position: relative; } .Page002623 .Pages .p_page > a:before { position: absolute; content: ''; border: 5px solid transparent; left: 50%; top: 50%; margin: -5px 0 0 -10px; } .Page002623 .Pages .p_page > a.a_prev:before { border-right-color: #000; border-right-width: 8px; } .Page002623 .Pages .p_page > a.a_next:before { border-left-color: #000; border-left-width: 8px; margin-left: -4px; } .Page002623 .Pages a.a_prev:hover:before { border-right-color: #fff; } .Page002623 .Pages a.a_next:hover:before { border-left-color: #fff; } @media(max-width:1024px){ .Page002623{padding: calc(0 / 16 * 1em) 0 calc(120 / 16 * 1em) 0;} } @media(max-width:640px) { .Page002623 { padding: 8vw 0; } .Page002623 .Pages em { display: block; } .Page002623 .Pages a { background-color: #eee;width: 30px;height: 30px;line-height: 30px;} .Page002623 .Pages .p_page > a{height: 30px;} } /*Other003014 */ .Other003014{} .Other003014 .float-btn{ z-index: 199;position: fixed;right: 0;bottom: 23%;width: 80px;height: 80px;} .Other003014 .float-btn li{padding-bottom: 1px;} .Other003014 .float-btn li a img{display: inline-block;width: 26px;} .Other003014 .float-btn li a span{display: block;width: 100%;margin-top: 10px;font-size: 14px;line-height: 1;} .Other003014 .float-btn li a{text-align: center;width: 78px; height: 72px;padding-top: 10px;box-shadow: 2px 2px 10px rgb(21 80 145 / 54%); background-color: #155091; cursor: pointer;padding: 10px 0;line-height: 1;border-radius: 10px;color: #fff;float: right;} .Other003014 .float-btn li a:hover{background-color:#ac1e2a; } .Other003014 .float-btn li a.open-kefu{} .Other003014 .float-btn li a.gettop{line-height: 43px;text-align: center;color: #fff;font-size: 12px;} .Other003014 .fixed-box{position: fixed; left: 0; top: 0; width: 100%; z-index: 200; height: 100%;background: rgba(0,0,0,0.6);display: none;} .Other003014 .fixed-box .ytable{height: 100%;} .Other003014 .fixed-box .main{max-width: 1300px;color: #fff;background:#f3f6fa; text-align:center;position: relative; } .Other003014 .fixed-box .close{ width: 40px; height: 40px;right: 15px;position: absolute;top: 15px; transform: rotate(45deg);cursor: pointer;z-index: 999;} .Other003014 .fixed-box .close:before, .Other003014 .fixed-box .close:after{position: absolute; left: 50%; top: 50%; content: '';background: #155091;} .Other003014 .fixed-box .close:before{width: 50%; height: 2px; margin-top: -1px; margin-left: -25%;} .Other003014 .fixed-box .close:after{height: 50%; width: 2px; margin-left: -1px; margin-top: -25%;} .Other003014 .fixed-box h4{font-size: 40px;font-weight: normal; margin: 0;} .Other003014 .fixed-box dl{ margin: 0 auto;} .Other003014 .fixed-box dt{} .Other003014 .fixed-box dt .icon{height: 48px;background-position: center center;background-repeat: no-repeat;} .Other003014 .fixed-box dt .icon-email{background-image: url("../images/Other003014_email.png");} .Other003014 .fixed-box dt .icon-tel{background-image: url("../images/Other003014_tel.png");} .Other003014 .fixed-box dt .icon-contact{background-image: url("../images/Other003014_contact.png");} .Other003014 .fixed-box dt .word .t-1{font-size: 20px;line-height: 1.5em;} .Other003014 .fixed-box dt .btn, .Other003014 .fixed-box dt .word .t-2{} .Other003014 .fixed-box dt .btn{display: block;font-size: 16px;line-height: 38px;border: 1px solid #fff; margin: 0 17%;color: #fff; cursor: pointer; transition: 0.3s;} .Other003014 .fixed-box dt .btn:hover{color: #b18d70;background: #fff;} @media(min-width:641px){ .Other003014 .fixed-box dt{float: left;} } @media(min-width:1025px){ .Other003014 .fixed-box .main{padding-bottom: 5vh;} .Other003014 .fixed-box h4{padding:0 0 30px 0; } .Other003014 .fixed-box dt{padding: 5.913vh 0;width: 28.261%;} .Other003014 .fixed-box dt:not(:last-child){margin-right: 7.6085%;} .Other003014 .fixed-box dt .word{padding: 3.6vh 0;} } @media(max-width:1024px){ .Other003014 .float-btn{top: 32%;} .Other003014 .float-btn li a{width: 66px;height: 64px;padding: 8px 0;} .Other003014 .float-btn li a span{font-size: 12px;} .Other003014 .float-btn li a img{width: 24px;} .Other003014 .fixed-box .main{padding: 8vw 0;height: 75%;} .Other003014 .sub{max-height: 600px;overflow: scroll;} .Other003014 .sub .sub-intro{width: 90%;} .Other003014 .fixed-box h4{padding-bottom: 4vw;font-size: 5vw; } .Other003014 .fixed-box dt, .Other003014 .fixed-box dt .word{padding: 5vw 0;} } @media(min-width:641px) and (max-width:1024px){ .Other003014 .float-btn{right: 1%;} .Other003014 .fixed-box dt{width: 32%;} .Other003014 .fixed-box dt:not(:last-child){margin-right:2%;} } @media(max-width:640px){ .Other003014 .float-btn{right:1%;} .Other003014 .fixed-box dt:not(:last-child){margin-bottom: 2%;} .Other003014 .fixed-box dt .word{padding: 3vw 0;} .Other003014 .fixed-box dt .icon{height: 8vw;background-size: contain;} .Other003014 .fixed-box dt .btn{line-height: 2em;} .Other003014 .fixed-box dt .word .t-1{font-size: 4vw;} .Other003014 .fixed-box dt .word .t-2{font-size: 3vw;} } .Other003014 .sub{ background-color:#fff; margin: 0;width: 100%;position: relative;} .Other003014 .sub dl{background: none;} .Other003014 .sub dt{text-align: center;line-height: 1.5;padding:5px 0} .Other003014 .sub .sub-intro{ max-width: 1400px; margin: 0 auto;} .Other003014 .sub .sub-left{float: left;width: 65%;} .Other003014 .sub .sub-right{float: right;width: 30%;} .Other003014 .prod-sub {background: #f3f6fa;padding: calc(120 / 1920 * 100vw) 0 0 0; } .Other003014 .prod-sub dl{text-align: center; padding: 0; display: flex;flex-wrap: wrap;} .Other003014 .prod-sub dt{float: left; text-align: left; width: 30%;margin-bottom:calc(30 / 1920 * 100vw) } .Other003014 .prod-sub dt:not(:nth-child(3n)){margin-right: 4%} .Other003014 .prod-sub dt .name{border-bottom: 1px solid rgba(0, 0, 0, 0.08);margin-bottom:calc(10 / 1920 * 100vw);position: relative; } .Other003014 .prod-sub dt .name::after {position: absolute;top: 52%;right: 15px;content: '';width: calc(10 / 16 * 1em);height: calc(10 / 16 * 1em);transform: rotate(45deg);border-top: 2px solid rgba(0, 0, 0, 0.1);border-right: 2px solid rgba(0, 0, 0, 0.1);margin-left: calc(18 / 16 * 1em); margin-top: calc(-12 / 16 * 1em);} .Other003014 .prod-sub dt .name h4{color: #333;font-size: calc(18 / 16 * 1em);font-weight: normal;margin: 0;padding-bottom: calc(10 / 18 * 1em)} .Other003014 .prod-sub dt .name h4 a{color: #333;} .Other003014 .prod-sub dt .name:hover h4 a{color: #155091;} .Other003014 .prod-sub dt .name:hover::after{ border-color: #155091;} .Other003014 .prod-sub dt .tab-label{line-height: 2; } .Other003014 .prod-sub dt .tab-label a{color: #949494;line-height:calc(40 / 16 * 1em);display:inline-block; font-size:calc(16 / 16 * 1em);} .Other003014 .prod-sub dt a:hover{color: #155091;} .Other003014 .sub .sub-right .pic {display: block;border-radius: 10px; padding-bottom: 67.86%;} .Other003014 .sub.prod-100 .sub-left{float: none;width: 100%;} .Other003014 .prod-sub.prod-100 dt{width: 21%;} .Other003014 .prod-sub.prod-100 dt:not(:nth-child(4n)){margin-right: 4%} @media(max-width:1024px){ .Other003014 .prod-sub.prod-100 dt{width: 100%;} .Other003014 .prod-sub.prod-100 dt:not(:nth-child(4n)){margin-right: 0;} .Other003014 .fixed-box .close{top: 5px;right: 5px;} } /*RighInfo003134 */ .RighInfo003134{padding:calc(120 / 16 * 1em) 0;} .RighInfo003134 .img-group{width: 38%;border: 1px solid #ddd;} .RighInfo003134 .img-side .txt{width: 62%;padding-left: 4%;} .RighInfo003134 .img-side .txt .xl{font-size: calc(24 / 16 * 1em);font-weight: normal;padding: 30px 0;border-bottom: 1px solid #ddd} .RighInfo003134 .ytable-cell{ } .RighInfo003134 .img-side{margin-bottom: 0;} .RighInfo003134 .img-side .ytable{} .RighInfo003134 .img-group li .Ispic{background-size: cover;padding-bottom: 80%;} .RighInfo003134 .img-side .tit{font-size: calc(36 / 16 * 1em); font-weight:bold; color: #155091; padding-bottom: 30px;position: relative;} .RighInfo003134 .img-side .tit::after{width: 60px; height: 3px; background: #155091; content: ''; display: block; margin:0;position: absolute;left: 0;bottom: 0;} .RighInfo003134 .img-side .con{line-height:2;color: #333; text-align: justify;padding-top: 2em;} .RighInfo003134 .img-side .con p{margin-top:0;font-size: 1em;line-height: 2;color: #333;} .RighInfo003134 .img-side .con img{width:100%} .RighInfo003134 .img-side p+p{margin-top:1em;} .RighInfo003134 .img-side .btn {margin-top: 3em;} .RighInfo003134 .img-side .btn a {display: inline-block;font-size: 1em;color: #fff;box-shadow: 0px 10px 30px rgba(218, 37, 29, 0.08);border-radius: 5px;margin: 0 5px; text-align: center;line-height: 3.3333;padding: 0 1.8125em;cursor: pointer;} .RighInfo003134 .img-side .btn a.download {background-color: #155091;float: right;opacity: 0.9;} .RighInfo003134 .img-side .btn a.download.fixed{position: fixed;right: 12.5vw;bottom: 10vw;opacity: 0.5;} .RighInfo003134 .img-side .btn a.download2 {background-color: #6e6e6e;} .RighInfo003134 .img-side .btn a:before {display: inline-block;vertical-align: top;content: '';background-size: contain;background-position: center;background-repeat: no-repeat; width: 2em;height: 3.3333em;margin-right: 0.5555em;} .RighInfo003134 .img-side .btn a.download:before {background-image: url(../images/RightFix-icon-kf-on.svg);} .RighInfo003134 .img-side .btn a.download2:before {background-image: url(../images/arrow-left.svg);} .RighInfo003134 .img-side .btn a:hover{background-color: #73bb00;opacity: 1;} @media (max-width:1024px) { .RighInfo003134{padding:calc(60 / 16 * 1em) 0;} .RighInfo003134 .img-group{width: 100%;} .RighInfo003134 .img-side .txt{width: 100%;padding-left: 0;padding-top: 6%;} .RighInfo003134 .img-side .tit{font-size: calc(22 / 16 * 1em);padding-bottom: 15px;} .RighInfo003134 .img-side .txt .xl{font-size: calc(20 / 16 * 1em);padding: 15px 0;} .RighInfo003134 .img-side .btn{margin-top: 2em;} .RighInfo003134 .img-side .btn a.download.fixed{bottom: 40vh;right: 5vw;line-height: 2;padding: 0 20px;opacity: 0.5;} } .More_con{ max-height: 14em; overflow-y: auto; padding-right: 10px;} .More_con::-webkit-scrollbar { width: 5px;height: 5px; } /* 滚动槽 */ .More_con::-webkit-scrollbar-track { -webkit-box-shadow:inset006pxrgba(0,0,0,0.3); border-radius:10px; background: #eeeeee; } /* 滚动条滑块 */ .More_con::-webkit-scrollbar-thumb { border-radius:10px; background:#155091; } .More_con .RighInfo003134-1{ background-color: transparent;} .RighInfo003134-1{padding:calc(120 / 16 * 1em) 0 calc(30 / 16 * 1em) 0;background:#f7f8fa; } .RighInfo003134-1 .list{margin-bottom: calc(90 / 16 * 1em);} .RighInfo003134-1 .list h1{font-size: calc(30 / 16 * 1em);line-height: 1;color: #333;background: url(../images/tb.png) no-repeat; background-size: 30px;padding-left: 45px;border-bottom: 1px solid #ddd;margin: 0 0 30px 0;padding-bottom: 30px;} .RighInfo003134-1 .list .con{padding:0;width: 100%;} /* .RighInfo003134-1 .list .mm img{max-height: 18em;} */ .RighInfo003134-1 .list p{font-size: 16px;line-height: 2;color: #666;margin: 0;} .RighInfo003134-1 .list ul li:not(.space){background-color: #fff;} .RighInfo003134-1 .list .list dl{display: table;width: 77.648%;margin: 0 auto;} .RighInfo003134-1 .list dl > *{vertical-align: top;} .RighInfo003134-1 .list dt{width: 100%;} .RighInfo003134-1 .list dt .icon{position: relative; font-size:48px;line-height: 60px;color: #155091; font-weight: 400; border-radius: 50%;text-align: left; } .RighInfo003134-1 .list dt .icon img{ max-height:1.5em;position: absolute;left: 50%;top: 50%; transform: translate(-50%,-50%);} .RighInfo003134-1 .list dd{width: 100%;margin-top: 30px;} .RighInfo003134-1 .list dd h3{margin: 0;font-size: 1.125em;color: #333;} .RighInfo003134-1 .list dd aside{color: #333; font-size: 18px;line-height: 2;} .RighInfo003134-1 .list .Floor000881{padding: 0;} .RighInfo003134-1 .list .Floor000881 .ul{display: block;} .RighInfo003134-1 .list .Floor000881 ul li{padding: 0; background-color: transparent; border: none;} @media (min-width:1025px) { .RighInfo003134-1 .list ul{display: table;width: 100%; min-height: 11.25em;} .RighInfo003134-1 .list ul li{display: table-cell; vertical-align: top;} .RighInfo003134-1 .list ul li{padding: 2.5%;border: 1px solid #ddd;width: 25%;margin-left: -1px;} .RighInfo003134-1 .list ul li:nth-child(2n){border-left: none;} .RighInfo003134-1 .list ul li:nth-child(3){border-left: none;} .RighInfo003134-1 .list .con span{width: 50%;margin:8px 0;font-size: 1.125em;} } @media (max-width:1024px) { .RighInfo003134-1{padding:calc(60 / 16 * 1em) 0 calc(15 / 16 * 1em) 0;} .RighInfo003134-1 .list{margin-bottom: calc(45 / 16* 1em)} .RighInfo003134-1 .list .auto{padding: 2em 0;} .RighInfo003134-1 .list ul li:not(.space){padding:2em 0;} .RighInfo003134-1 .list ul li.space{height: 1em;} .RighInfo003134-1 .list h1{font-size: calc(22 / 16 * 1em);background-size: 22px;padding-left: 32px;padding-bottom: 15px;} .RighInfo003134-1 .list .con span{width: 100%;margin:2px 0;font-size: 1em;} } .RighInfo003134-1 .list .con span{display:inline-block;line-height:1.8;color:#333;padding-left:45px;position:relative;float:left; } .RighInfo003134-1 .list .con span::before{content: "";width: 8px;height: 8px;background:#155091;display:inline-block; position:absolute;left:15px;top: 50%;margin-top: -4px; } .RighInfo003134-1 .list .con .info{padding: 45px 45px 0;background: #fff;width: 100%;float: left;} .RighInfo003134-1 .list .con h4{display: block;font-size: 20px;width: 160px;height: 48px;line-height: 48px; padding-left: 20px; margin: 0 0 30px 0;color: #155091;background: url(../images/bt1.png) no-repeat;background-size: cover;} .RighInfo003134-1 .list .con .info:nth-child(4){margin-bottom: 45px;} .RighInfo003134-1 .list .con .info p strong{color:#333;line-height:1;margin-bottom:10px;margin-right:10px; } .RighInfo003134-1 .list .con .info p{font-size: 16px;line-height: 2;color: #333;width: 50%;float: left; margin-bottom:15px;position: relative;padding-left: 40px;} .RighInfo003134-1 .list .con .info p::before{content: "";width: 6px;height:6px;border-radius: 6px; background:#155091;display:inline-block;position:absolute;left:20px;top:14px; } .bg_fff{background: #fff;} .RighInfo003134-1 .table_1{background: #fff;} .RighInfo003134-1 .table_1 th, .RighInfo003134-1 .table_1 td{ text-align:center; border:1px solid #eee; border-collapse:collapse; line-height:24px; padding:15px;font-size: 16px;width: 12.8%;} .RighInfo003134-1 .table_1 td a{display: inline-block; padding:5px 15px; border: 1px solid #685046; color: #685046; font-size: 14px;vertical-align: middle;} .RighInfo003134-1 .table_1 td a::after{display: inline-block;width: 14px; height: 14px; content:''; vertical-align: middle; margin-left: 10px; margin-top: -4px; background-position: center; background-size: contain; background-repeat: no-repeat;} .RighInfo003134-1 .table_1 td a+a{margin-left:10px;} .RighInfo003134-1 .table_1 td a.dow::after{background-image: url(../images/dow.svg);} .RighInfo003134-1 .table_1 td a.yl::after{background-image: url(../images/yl.svg);} .RighInfo003134-1 .table_1 th{ font-size:16px; font-weight:normal;} .RighInfo003134-1 .table_1 .th_1{width: 10%;} .RighInfo003134-1 .table_1 .th_2{width: 15%;} .RighInfo003134-1 .table_1 .th_3{width: 30%;} .RighInfo003134-1 .table_1 .th_4{ background:#685046;color: #fff;} .RighInfo003134-1 .table_1 .th_5{width: 15%;} .RighInfo003134-1 .table_1 .th_6{width: 30%;} .RighInfo003134-1 .table_1 .th_1, .RighInfo003134-1 .table_1 .th_2, .RighInfo003134-1 .table_1 .th_3, .RighInfo003134-1 .table_1 .th_5, .RighInfo003134-1 .table_1 .th_6{ color:#fff;background:#155091;} .RighInfo003134-1 .table_1 .th_0{background: #155091;color: #fff;} @media(max-width:480px){ .RighInfo003134-1 .table_1{ overflow:auto;} .RighInfo003134-1 .table_1 table{ width:180%;} } /* 核心产品 */ .RighInfo003134-1 .list .pro-list{ } .RighInfo003134-1 .list .pro-list .item{position:relative; width:48%;float: left; height:auto; background:#fff; padding:40px 40px 20px; box-shadow: 0px 6px 18px 0px rgba(35, 35, 35, 0.11); border-radius: 12px; margin-right:4%; } .RighInfo003134-1 .list .pro-list .item:nth-child(2n){margin-right: 0;} .RighInfo003134-1 .list .pro-list .item ul{display: block;min-height: auto;} .RighInfo003134-1 .list .pro-list .item li{display: block;width: 100%;padding:15px; font-size:1em; line-height:1.8; position:relative; border: none;} /*.RighInfo003134-1 .list .pro-list .item li::before{ position:absolute; left:0; top:33%; content:''; display:block; width:3px; height:3px; border-radius:50%; background:#ababab;}*/ .RighInfo003134-1 .list .pro-list .item a{ color:#212121;} .RighInfo003134-1 .list .pro-list .item .tit{ padding-bottom:15px; margin-bottom:15px; font-size:calc(24 / 16 * 1em); border-bottom:solid 1px #d2e0ef;} .RighInfo003134-1 .list .pro-list .item .des{ line-height:2; margin-bottom:15px;font-size:1em;color:#333; } .RighInfo003134-1 .list .pro-list .item .des p{color: #333;} .RighInfo003134-1 .list .pro-list .item .pic{ text-align:right;} .RighInfo003134-1 .list .pro-list .item .pic img{max-width: 100%;} .RighInfo003134-1 .list .pro-list .item .more{ position:absolute; bottom:40px; left:40px;} .RighInfo003134-1 .list .pro-list .item .more i{ display: -webkit-flex; display:flex; align-items:center; justify-content:center; width:35px; height:35px; border:solid 1px #c4c4c4; border-radius:5px; text-align:center;} .RighInfo003134-1 .list .pro-list .item .more i::after{position: absolute;top: 50%;right: 15px;content: ''; width: calc(12 / 16 * 1em);height: calc(12 / 16 * 1em);transform: rotate(45deg); border-top: 2px solid rgba(0, 0, 0, 0.27);border-right: 2px solid rgba(0, 0, 0, 0.27); margin-left: calc(18 / 16 * 1em); margin-top: calc(-6 / 16 * 1em); } @media (max-width:1024px) { .RighInfo003134-1 .list .pro-list .item .pic img{max-width:200px;} } @media (max-width:640px) { .RighInfo003134-1 .list .pro-list .item{ width:100%; margin-bottom:40px;} .RighInfo003134-1 .list .pro-list .item li{ font-size:calc(24 / 16 * 1em);} .RighInfo003134-1 .list .pro-list .item .tit{ font-size:calc(30 / 16 * 1em);} .RighInfo003134-1 .list .pro-list .item .pic img{max-width:300px;} } /*Floor002885 */ .Floor002885{font-size: 16px;} .Floor002885 .slider li.slick-slide{position: relative;} .Floor002885 .slider .pic img{display: block;width: 100%;} .Floor002885 .slider .ytable{max-width: 1440px;width: 96%;margin: 0 auto; } .Floor002885 .tit-1{color: #155091;padding-left: 10px;border-left: 5px solid #155091;} .Floor002885 .tit-2{font-size: 36px;color: #333;margin: 1.56vw 0;} .Floor002885 .txt pre{color: #999999;line-height: 1.25em;height:3.75em; margin-bottom: 2.7vw;} .Floor002885 .txt dd{float: left;position: relative; z-index: 4;} .Floor002885 .txt dd:not(:last-child){margin-right: 20px;} .Floor002885 .txt dd a{display: block;line-height: 48px; border: 2px solid #155091; padding: 0 42px;color: #155091; border-radius: 50px;} .Floor002885 .txt dd:hover a{color: #fff;background: #155091;} .Floor002885 .txt dd figure{position: absolute; left: 50%;margin-left: -75px; bottom: 100%;margin-bottom: 20px;box-shadow: 0 0 13px rgba(219,84,0,0.2); overflow: hidden;border-radius: 5px; width: 150px;display: none;} .Floor002885 .txt dd figure img{display: block; width: 100%;} .Floor002885 .slick-arrow{position: absolute; width: 38px; height: 38px;border-radius: 50%; border: 1px solid #ddd; z-index: 20;background: #fff;} .Floor002885 .slick-arrow:before{position: absolute; content: ''; width: 20%; height: 20%;border-left: 2px solid #155091;border-top: 2px solid #155091; transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg); left: 40%; top: 40%;} .Floor002885 .slick-next:before{transform: rotate(135deg);-webkit-transform: rotate(135deg);-ms-transform: rotate(135deg);} @media(min-width:1025px){ .Floor002885 .slider .txt{position: absolute; left: 0; top: 0; width: 100%;height: 100%;z-index: 10;} .Floor002885 .slider .ytable{height: 100%;} .Floor002885 .txt .ytable-cell > *{max-width: 50%;} .Floor002885 .slick-arrow{ top: 60%; margin-top: -30px;} .Floor002885 .slick-prev{left: 0;} .Floor002885 .slick-next{right: 0;} } @media(min-width:1025px) and (max-width:1560px){ .Floor002885 .slider .ytable{ margin: 0 2.6vw;padding: 0 80px;} } @media(max-width:1024px){ .Floor002885 .txt{padding: 9vw 0;} .Floor002885 .slider .pic{overflow: hidden;} .Floor002885 .slider .pic img{float: right;width: 146%;max-width: none;} .Floor002885 .slick-arrow{right: 2vw; top: 2vw;} .Floor002885 .slick-prev{margin-right: 70px;} } @media(max-width:768px){ .Floor002885{font-size: 14px;} .Floor002885 .slick-arrow{width: 8vw;height: 8vw;} .Floor002885 .slick-prev{margin-right: 9vw;} .Floor002885 .tit-2{font-size: 20px;margin: 20px 0;} .Floor002885 .txt dd a{padding: 0 6vw; line-height: 40px;} } @media(max-width:480px){ .Floor002885 .txt dd figure{width: 30vw;margin-left: -15vw;} } /*Floor002885 */ .Floor002885-1{font-size: 16px;} .Floor002885-1 .slider li.slick-slide{position: relative;} .Floor002885-1 .slider .pic img{display: block;width: 100%;} .Floor002885-1 .slider .ytable{max-width: 1440px;width: 96%;margin: 0 auto; } .Floor002885-1 .tit-1{color: #155091;padding-left: 10px;border-left: 5px solid #155091;} .Floor002885-1 .tit-2{font-size: 36px;color: #333;margin: 1.56vw 0;} .Floor002885-1 .txt pre{color: #999999;line-height: 1.25em;height:3.75em; margin-bottom: 2.7vw;} .Floor002885-1 .txt dd{float: left;position: relative; z-index: 4;} .Floor002885-1 .txt dd:not(:last-child){margin-right: 20px;} .Floor002885-1 .txt dd a{display: block;line-height: 48px; border: 2px solid #155091; padding: 0 42px;color: #155091; border-radius: 50px;} .Floor002885-1 .txt dd:hover a{color: #fff;background: #155091;} .Floor002885-1 .txt dd figure{position: absolute; left: 50%;margin-left: -75px; bottom: 100%;margin-bottom: 20px;box-shadow: 0 0 13px rgba(219,84,0,0.2); overflow: hidden;border-radius: 5px; width: 150px;display: none;} .Floor002885-1 .txt dd figure img{display: block; width: 100%;} .Floor002885-1 .slick-arrow{position: absolute; width: 38px; height: 38px;border-radius: 50%; border: 1px solid #ddd; z-index: 20;background: #fff;} .Floor002885-1 .slick-arrow:before{position: absolute; content: ''; width: 20%; height: 20%;border-left: 2px solid #155091;border-top: 2px solid #155091; transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg); left: 40%; top: 40%;} .Floor002885-1 .slick-next:before{transform: rotate(135deg);-webkit-transform: rotate(135deg);-ms-transform: rotate(135deg);} @media(min-width:1025px){ .Floor002885-1 .slider .txt{position: absolute; left: 0; top: 0; width: 100%;height: 100%;z-index: 10;} .Floor002885-1 .slider .ytable{height: 100%;} .Floor002885-1 .txt .ytable-cell > *{max-width: 50%;} .Floor002885-1 .slick-arrow{ top: 60%; margin-top: -30px;} .Floor002885-1 .slick-prev{left: 0;} .Floor002885-1 .slick-next{right: 0;} } @media(min-width:1025px) and (max-width:1560px){ .Floor002885-1 .slider .ytable{ margin: 0 2.6vw;padding: 0 80px;} } @media(max-width:1024px){ .Floor002885-1 .txt{padding: 9vw 0;} .Floor002885-1 .slider .pic{overflow: hidden;} .Floor002885-1 .slider .pic img{float: right;width: 146%;max-width: none;} .Floor002885-1 .slick-arrow{right: 2vw; top: 2vw;} .Floor002885-1 .slick-prev{margin-right: 70px;} } @media(max-width:768px){ .Floor002885-1{font-size: 14px;} .Floor002885-1 .slick-arrow{width: 8vw;height: 8vw;} .Floor002885-1 .slick-prev{margin-right: 9vw;} .Floor002885-1 .tit-2{font-size: 20px;margin: 20px 0;} .Floor002885-1 .txt dd a{padding: 0 6vw; line-height: 40px;} } @media(max-width:480px){ .Floor002885-1 .txt dd figure{width: 30vw;margin-left: -15vw;} } .lm-title{line-height: 40px;} .lm-title:after{display: block; content: ''; margin: 25px 0 35px;width: 35px; height: 4px; background: #155091;} .lm-title .cn{font-size: 36px;color:#333;font-weight: bold;} .lm-title p{margin-bottom:0;} .lm-title.center{text-align: center;} .lm-title.center:after{margin:25px auto 35px;} @media(max-width:480px){ .lm-title .cn{font-size: 24px; } } /*RighInfo002806 */ .RighInfo002806{padding: 5% 0;} .RighInfo002806 .txt{width:100%} .RighInfo002806 .txt h2{font-size: calc(32 / 16 * 1em);margin-bottom: calc(12 / 16 * 1em);color:#155091;} .RighInfo002806 .txt p{line-height: 1.875;font-size: calc(16 / 16 * 1em);text-align: justify;margin:10px 0;} .RighInfo002806 .pic{width:46%;float:right;margin-left:5%;margin-bottom:3%;} .RighInfo002806 .num{padding-bottom: 10%;} .RighInfo002806 .num .pic img{display: block; width: 100%;} .RighInfo002806 .num .list{ margin-top: 7.518%;position: relative;} .RighInfo002806 .num .list:before, .RighInfo002806 .num .list:after{position: absolute; content: ''; border: 5px solid #f6550d; width: 30px; height: 30px;} .RighInfo002806 .num .list:before{left: 0; top: 0; border-right: 0;border-bottom: 0;} .RighInfo002806 .num .list:after{right: 0; bottom: 0; border-top: 0;border-left: 0;} .RighInfo002806 .num .list li{float:left; width: 55%; padding: 30px 0;} .RighInfo002806 .num .list li:nth-child(2n){width: 45%} .RighInfo002806 .num .list li:nth-child(2n+1){clear: left;} .RighInfo002806 .num .list li .inner{padding-left: 16%;color: #f6550d;font-size: 100px;} .RighInfo002806 .num .list li aside{overflow: hidden; height: 0.6em;} .RighInfo002806 .num .list li sub{font-size: 0.24em;text-transform: uppercase; line-height: 0.8em;float: left;margin-top: 1.7em;} .RighInfo002806 .num .list li sup{font-size: 0.5em;line-height: 0.7em;vertical-align:top;} .RighInfo002806 .num .list li span{font-size: 0.8em;line-height: 0.725em;vertical-align: text-top;} .RighInfo002806 .num .list li p{font-size: 0.2em;} .RighInfo002806 .num .list li aside *{display: inline-block;} @media(min-width:769px){ .RighInfo002806 .num .list{float: left; width: 50%;} } @media(max-width:1280px){ .RighInfo002806 .num .list li .inner{font-size: 80px;} } @media(max-width:1024px){ .RighInfo002806 .num .list li .inner{font-size: 70px;} .RighInfo002806 .pic{width: 100%;float: none;margin-left: 0%;margin-bottom: 3%;} .RighInfo002806 .txt h2{font-size: calc(24 / 16* 1em);} } @media(max-width:480px){ .RighInfo002806 .num .list li .inner{font-size: 50px;} } .RighInfo002807{background-repeat: no-repeat;background-position: center;background-size:cover;padding:5% 0;} .RighInfo002807 .culture ul{padding: 3% 0 4%;} .RighInfo002807 .culture li{ vertical-align: top;color: #fff;text-align: center} .RighInfo002807 .culture li aside{font-size: 2.5em; margin: 15% 0 6% 0;} .RighInfo002807 .culture li p{line-height: 2; font-size: calc(22 / 16* 1em);} @media(min-width:481px){ .RighInfo002807 .culture ul{display: table;width: 100%;} .RighInfo002807 .culture li{display: table-cell;width: 33.333333%;padding:0 2%; } .RighInfo002807 .culture li:not(:last-child){border-right: 1px solid rgba(255,255,255,0.2);} } @media(min-width:481px) and (max-width:640px){ .RighInfo002807 .culture li img{height: 40px;} } @media(max-width:640px){ .RighInfo002807 .culture li aside{font-size: calc(20 / 16* 1em); } .RighInfo002807 .culture li p{line-height: 24px; font-size: calc(16 / 16* 1em);} } @media(max-width:480px){ .RighInfo002807 .culture{background-size:100% 100%;} .RighInfo002807 .culture li{padding:5%; margin: 0 5%;} .RighInfo002807 .culture li aside{ margin: 6% 0;} .RighInfo002807 .culture li:not(:last-child){border-bottom: 1px solid rgba(255,255,255,0.5); margin-bottom: 3%;} } /*Timeline000913 */ .Timeline000913{padding:5% 0;} .Timeline000913 .main{position: relative; z-index: 1; padding-bottom: 5.396vw;} .Timeline000913 .main .quan{display: block;width: 10px; height: 10px; border-radius: 50%; background: #fff;border: 1px solid #dedede;} .Timeline000913 .main:before{position: absolute; content:'';width: 1px; top: 10px; bottom: 0;background: #e6e6e6; } @media(min-width:769px){ .Timeline000913 .main .quan{ margin: 0 auto; } .Timeline000913 .main:before{left: 50%;} .Timeline000913 .outer > .ytable-cell{width: 50%;} } @media(max-width:768px){ .Timeline000913 .outer, .Timeline000913 .outer > .ytable-cell{display: block;} .Timeline000913 .main:before{left: 5px;} } .Timeline000913 .item{position: relative;z-index: 4;} .Timeline000913 .item:not(:last-child){margin-bottom: 1.5vw;} .Timeline000913 .info{position: relative;} .Timeline000913 .info:before{position: absolute; content: ''; top: 50%; margin-top: -16px; border:16px solid transparent;} .Timeline000913 .info .inner{background: #f8f8f8; padding: 1vw;} .Timeline000913 .pic{width: 32.787%;} .Timeline000913 .pre pre{font-size: calc(15 / 16* 1em);line-height: 1.8; text-align: left;} .Timeline000913 .year{color: #155091;font-weight: bold;} .Timeline000913 .year aside{background-repeat: no-repeat;background-image: url("../images/Timeline000913_icon.png");font-size: calc(50 / 16* 1em);} @media(min-width:769px){ .Timeline000913 .item:nth-of-type(2n-1) .info{padding-right: 32px;} .Timeline000913 .item:nth-of-type(2n) .info{padding-left: 32px;} .Timeline000913 .item:nth-of-type(2n-1) .info:before{right: 0;border-left-color: #f8f8f8;} .Timeline000913 .item:nth-of-type(2n) .info:before{left: 0;border-right-color: #f8f8f8;} .Timeline000913 .item:nth-of-type(2n-1) .pre{padding-left: 1.5vw;} .Timeline000913 .item:nth-of-type(2n) .pre{padding-right: 1.5vw;} .Timeline000913 .item:nth-of-type(2n-1) .year aside{margin-left: -10px;background-position: left center;} .Timeline000913 .item:nth-of-type(2n-1) .year aside:before, .Timeline000913 .item:nth-of-type(2n) .year aside:after{display: inline-block; content: ''; width: 30px; height: 1px; vertical-align: middle;background: #e4e4e4; margin: -10px 32px 0;} .Timeline000913 .item:nth-of-type(2n) .year aside{background-position: right center;margin-right: -11px; text-align: right;} } @media(max-width:768px){ .Timeline000913 .main{margin-left: 3vw;} /* .Timeline000913 .year{font-size: 7vw;} */ .Timeline000913 .year aside{padding-left: 32px;background-position: left center;margin-left: -5px;font-size: calc(40 / 16* 1em);} .Timeline000913 .year aside:before{display: inline-block; content: ''; width: 30px; height: 1px; vertical-align: middle;background: #d9d9d9; margin: -1vw 3vw 0;} .Timeline000913 .info{padding: 3vw;} .Timeline000913 .pre{padding-left: 3vw;} } @media(max-width:480px){ .Timeline000913 .pic{width:45%;} .Timeline000913 .pre pre{font-size: 3.5vw;} } /*PicList002433 */ /*slick Basic*/ .PicList002433 .slick-slider { position:relative;display: block;-webkit-touch-callout: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent} .PicList002433 .slick-list { position: relative; z-index: 1;display: block; overflow: hidden;} .PicList002433 .slick-list:focus {outline: none} .PicList002433 .slick-list.dragging {cursor: pointer;cursor: hand;} .PicList002433 .slick-slider .slick-track, .PicList002433 .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .PicList002433 .slick-track {position: relative; top: 0; left: 0; display: block;} .PicList002433 .slick-track:before, .PicList002433 .slick-track:after{display: table; content: '';} .PicList002433 .slick-track:after{ clear: both;} .PicList002433 .slick-loading .slick-track { visibility: hidden;} .PicList002433 .slick-slide{ display: none; float: left;min-height: 1px;} [dir = 'rtl'] .slick-slide {float: right;} .PicList002433 .slick-slide .slick-loading img { display: none;} .PicList002433 .slick-slide .dragging img { pointer-events: none;} .PicList002433 .slick-initialized .slick-slide { display: block;} .PicList002433 .slick-loading .slick-slide { visibility: hidden;} .PicList002433 .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} .PicList002433 .slick-arrow .slick-hidden { display: none;} /*slick Basic End*/ .PicList002433{background-image: linear-gradient( #f8f8f8, transparent);padding:5% 0 4%;} .PicList002433 .main{ padding:1% 0 0 0;} .PicList002433 .main .slick-arrow{ position:absolute; top:45%; width:50px; height:50px; margin-top:-30px; border:1px solid #155091; padding:0; background:none; font-size:0; z-index:10; cursor:pointer; border-radius:50%;} .PicList002433 .main .slick-arrow:hover{ background:#155091; } .PicList002433 .main .slick-arrow:before{ position:absolute; content:''; width:15px; height:15px; border-top:2px solid #155091; border-right:2px solid #155091; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); left:50%; top:50%; margin:-8px 0 0 -10px;} .PicList002433 .main .slick-arrow:hover:before{ border-color:#fff;} .PicList002433 .main .slick-prev:before{transform:rotate(-135deg); -webkit-transform:rotate(-135deg); -ms-transform:rotate(-135deg); margin-left:-5px;} .PicList002433 .main .slick-prev{ left:-59px;} .PicList002433 .main .slick-next{ right:-59px;} @media(max-width:1408px){ .PicList002433 .main .slick-prev{ left:2%;} .PicList002433 .main .slick-next{ right:2%;} } @media(max-width:640px){ .PicList002433 .main .slick-arrow{ width: 7vw;height: 7vw;margin-top: -3.5vw;} .PicList002433 .main .slick-arrow:before{width:40%; height: 40%;margin: 0;left: 40%; top: 30%;} .PicList002433 .main .slick-next:before{left: 20%;} } .PicList002433 .list ul{ padding:0 50px;} .PicList002433 .list li{ float:left; position:relative; text-align:center; margin-bottom:0%;} .PicList002433 .list li:first-child:before, .PicList002433 .list li:last-child:after{ position:absolute; content:''; bottom:0px; height:90px; width:50px;} .PicList002433 .list li:first-child:before{ left:-50px; background:url(../images/PicList002433_ul_l.png) no-repeat 0 0;} .PicList002433 .list li:last-child:after{right:-50px; background:url(../images/PicList002433_ul_r.png) no-repeat 0 0;} .PicList002433 .list li aside{ padding-top:35px;height:90px; background:url(../images/PicList002433_libg.png) repeat-x left top;} .PicList002433 .list li .ytable{ height:250px;} .PicList002433 .list li .ytable-cell{ vertical-align:bottom;} .PicList002433 .list li figure{ position:relative; display:inline-block;max-width: 80%;} .PicList002433 .list li figure:after{ position:absolute; right:-24px; background:url(../images/PicList002433_ying.png) no-repeat left bottom; width:24px; height:100%; background-size:contain; content:'';} .PicList002433 .list li figure img{ max-height:250px;padding: 8px;padding-top: 12px;background: url(../images/PicList002433_kuang.png) no-repeat ;background-size:100% 100%;} .PicList002433 .list li p{ margin:0 auto; width:90%; line-height:20px; max-height:40px; color:#333;font-size:1.125em;} .PicList002433 .list .ul-3 li{width:33.33333333%;} .PicList002433 .list .ul-3 li:nth-child(3):after{ position:absolute; content:''; bottom:0px; height:90px; width:50px; right:-50px; background:url(../images/PicList002433_ul_r.png) no-repeat 0 0;} .PicList002433 .list .ul-2 li{width:50%;} .PicList002433 .list .ul-2 li:nth-child(2):after{ position:absolute; content:''; bottom:0px; height:90px; width:50px; right:-50px; background:url(../images/PicList002433_ul_r.png) no-repeat 0 0;} .PicList002433 .list .ul-2 li:nth-child(1) > *{ padding-left:30%;} .PicList002433 .list .ul-2 li:nth-child(2) > *{ padding-right:30%;} .PicList002433 .list .ul-1 li{width:100%;} @media(max-width:640px){ .PicList002433 .auto, .PicList002433 .list ul{ padding:0;} .PicList002433 .list li p{ font-size:12px;} .PicList002433 .list li .ytable{ height:150px;} .PicList002433 .list li figure img{ max-height:150px; padding:3px} .PicList002433 .list .ul-2 li:nth-child(1) > *{ padding-left:30%;} .PicList002433 .list .ul-2 li:nth-child(2) > *{ padding-right:30%;} .PicList002433 .list .ul-3 li:nth-child(3):after, .PicList002433 .list li:first-child:before{ display:none;} } @media(max-width:480px){ .PicList002433 .list li .ytable{ height:100px;} .PicList002433 .list li figure img{ max-height:100px;} } /*Menu002147 */ .Menu002147{ background:#f8f8f8;} .Menu002147 ul{ display:table; margin:0 auto;} .Menu002147 li{ float:left; padding:0 35px;position:relative;} .Menu002147 li:after{ position:absolute; content:''; width:1px; right:0; top:50%; height:14px; margin-top:-7px; background:#dfdfdf;} .Menu002147 li.end:after{ display:none;} .Menu002147 li a{ display:block;font-size:16px; position:relative; overflow:hidden; line-height:78px;height:78px;} .Menu002147 li a:after{ position:absolute; left:0; bottom:0;content:''; height:2px; width:100%;} .Menu002147 li.aon a, .Menu002147 li:hover a{ color:#155091;} .Menu002147 li.aon a:after, .Menu002147 li:hover a:after{ background:#155091;} @media(max-width:1024px){ .Menu002147 li{ padding:0 20px;} .Menu002147 li a{ line-height:50px;height:50px;} } @media(max-width:768px){ .Menu002147 ul{ display:block;} .Menu002147 li{ float:left; width:25%; text-align:center; padding:0;} } @media(max-width:768px) and (min-width:481px){ .Menu002147 li:nth-child(4n):after{ display:none;} } @media(max-width:480px){ .Menu002147 li{ width:33.33333333333%} .Menu002147 li:nth-child(3n):after{ display:none;} } @media(max-width:375px){ .Menu002147 li a{ font-size:14px;} } /* .TextList009 为demo编号 */ .TextList009{padding:5% 0 2%;} .TextList009 li {border: 1px solid #e8e8e8;margin-bottom: 20px;padding-left: 139px;position: relative;padding-right: 20px;} .TextList009 li a {height: 80px;line-height: 80px;font-size: 16px;display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;background: url(../images/TextList009-icon.png) no-repeat right center;padding-right: 40px;} .TextList009 li time {position: absolute;text-align: center;left: 0;top: 10px;height: 65px;width: 107px;color: #afafaf;border-right: 1px dashed #E0E0E0;line-height: normal;font-size: 14px;} .TextList009 li time span {display: block;font-size: 24px;padding-top: 8px;} .TextList009 li:hover {background-color: #155091;color: #fff;} .TextList009 li:hover a {background-image: url(../images/TextList009-icon_hover.png);color: #fff;} .TextList009 li:hover time {color: #fff;} @media(max-width:768px){ .TextList009 li{padding-right: 0;} } /* .RighInfo002799 */ .RighInfo002799{ padding: 5% 0;} .RighInfo002799 .pic{ float: right; margin-left: 8%;width:42%; } .RighInfo002799 .pic img{border-radius: 5px} .RighInfo002799 .subtit{font-size: 24px;color: #333; margin-top: 2%;position: relative;margin-bottom: 1%; } .RighInfo002799 .subtit:before{display: inline-block;content: '';width: 10px;height: 10px;background:none;position: relative;top:-4px;margin-right:10px;border-radius: 50%;border:2px solid #155091;} .RighInfo002799 p { font-size: 16px; color: #666; line-height: 30px; text-align: justify;margin:0; } .RighInfo002799 p:not(.subtit)::before{display: inline-block;content: '';width: 10px;height: 1px ;background:#999;margin-right: 8px;position: relative;top:-5px;} @media (max-width: 768px) { .RighInfo002799 .auto{ padding: 0 3%; } .RighInfo002799 .pic{ float: none; width: 100%; margin-bottom: 5%; margin-left: 0; } } .Solution{padding:5% 0 ;} .Solution .text{width:44%;float:left;} .Solution .text p{font-size:16px;line-height: 30px;text-align: justify;margin:12px 0; } .Solution .pic{width:50%;float:right;} @media (min-width: 1025px) { .Solution .auto{ display: flex; justify-content: space-between;} .Solution .text{ position: relative;} .Solution .warp{ max-height: 100%; overflow: auto; position: absolute; left: 0; top: 0; width: 100%; height: 100%; max-height: 100%; overflow: auto; padding-right: 10px; } .Solution .warp::-webkit-scrollbar {width: 5px;height: 5px;} /* 滚动槽 */ .Solution .warp::-webkit-scrollbar-track {-webkit-box-shadow:inset006pxrgba(0,0,0,0.3);border-radius:10px;background: #eeeeee;} /* 滚动条滑块 */ .Solution .warp::-webkit-scrollbar-thumb {border-radius:10px;background:#155091;} } @media(max-width:1024px){ .Solution .text{width:100%;float:none;} .Solution .pic{width:100%;float:none;} } /* .Floor000881 为demo编号 */ .Floor000881{ background-image: linear-gradient(#f8f8f8, transparent);padding:5% 0;} /*slick Basic*/ .Floor000881 .slick-slider { position:relative;display: block;-webkit-touch-callout: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent} .Floor000881 .slick-list { position: relative; z-index: 1;display: block; overflow: hidden;} .Floor000881 .slick-list:focus {outline: none} .Floor000881 .slick-list.dragging {cursor: pointer;cursor: hand;} .Floor000881 .slick-slider .slick-track, .Floor000881 .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .Floor000881 .slick-track {position: relative; top: 0; left: 0; display: block;} .Floor000881 .slick-track:before, .Floor000881 .slick-track:after{display: table; content: '';} .Floor000881 .slick-track:after{ clear: both;} .Floor000881 .slick-loading .slick-track { visibility: hidden;} .Floor000881 .slick-slide{ display: none; float: left;min-height: 1px;} [dir = 'rtl'] .slick-slide {float: right;} .Floor000881 .slick-slide .slick-loading img { display: none;} .Floor000881 .slick-slide .dragging img { pointer-events: none;} .Floor000881 .slick-initialized .slick-slide { display: block;} .Floor000881 .slick-loading .slick-slide { visibility: hidden;} .Floor000881 .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} .Floor000881 .slick-arrow .slick-hidden { display: none;} /*slick Basic End*/ .Floor000881 .list_scroll li a{display: block; margin: 0 16px;background:#fff;border:1px solid #eee;} .Floor000881 .list_scroll li .Ispic{padding-bottom:80%;background-size:80%;} .Floor000881 .list_scroll li p{text-align:center; margin:0; line-height:60px;font-size:18px;} .Floor000881 .list_scroll li a:hover{ } .Floor000881 .list_scroll li a:hover p{color:#155091;} .Floor000881 .list_scroll .content{ display: none;} .Floor000881 .slick-arrow{ position:absolute; width:26px; height:26px; top:50%; margin-top:-11px; overflow:hidden;font-size: 0; cursor: pointer;z-index:10; border: 0;background: none;padding: 0; border-top: 2px solid #155091;border-left: 2px solid #155091;transform:rotate(-45deg);} .Floor000881 .slick-prev{ left:-25px;} .Floor000881 .slick-next{transform:rotate(135deg); right:-25px;} @media(min-width:1293px){ .Floor000881 .list_scroll .slider{margin: 0 -16px;} } @media(max-width:1292px){ .Floor000881 .slick-prev{ left:0;} .Floor000881 .slick-next{ right:0;} } @media(max-width:768px){ .Floor000881{ padding:20px 0;} .Floor000881 .list_scroll .slider{padding: 0 26px;} .Floor000881 .list_scroll li a{margin: 0 5px;} } .Floor000881 .table_1 tr{ background-color: #fff;} .Floor000881 .table_1 th, .Floor000881 .table_1 td{ border: 1px solid #dddddd; border-collapse:collapse; line-height:24px; padding:calc(12 / 16 * 1em) calc(10 / 16 * 1em);font-size:calc(16 / 16 * 1em);text-align: center;} .Floor000881 .table_1 th{ background:#155091;color: #fff} .Floor000881 .table_1 tr:nth-child(2n+1){ background: #f5f5f5;} .Floor000881 .table_1 td img{max-height: calc(60 / 16 * 1em);} .Floor000881 .table_1 a:hover{ color: #155091;} @media(max-width:640px){ .Floor000881 .table_1{ overflow:auto;} .Floor000881 .table_1 table{ width:250%;} .Floor000881 .table_1 th, .Floor000881 .table_1 td{ font-size: 14px;padding:8px;} .Floor000881 .table_1 a{font-size: 14px;} } .news .newsList{padding: calc(80/1920 * 100%) 0;} .news .newsList .ul{display: flex; flex-wrap: wrap; justify-content: space-between; gap: calc(40/16 * 1em) calc(45/1600 * 100%); margin: calc(80/1600 * 100%) 0 calc(40/1600 * 100%);} .news .newsList .ul li{width: calc(450/1440 * 100%); transition: .3s; overflow: hidden;border: 1px solid #e6e6e6;border-radius: calc(10/16 * 1em);} .news .newsList .ul li figure{padding-bottom: calc(280/450 * 100%); background-size: cover; background-position: center;} .news .newsList .ul li .info{padding: calc(30/450 * 100%); padding-top: calc(48/450 * 100%); border-top: none;} .news .newsList .ul li .top{display: flex; justify-content: space-between; align-items: center; position: relative; padding-bottom: calc(30/693 * 100%); margin-bottom: calc(30/693 * 100%); } .news .newsList .ul li .top::after{position: absolute; transition: .3s; content: ""; width: calc(40/388 * 100%); height: 2px; bottom: 0; background-color: #155091; left: 0;} .news .newsList .ul li time .day{display: block; line-height: 1; font-size: calc(32/16 * 1em); color: #333;} .news .newsList .ul li time .year{display: block; color: #999; margin-top: calc(10/16 * 1em);} .news .newsList .ul li aside{font-size: calc(22/16 * 1em); color: #333; line-height: calc(34/22); transition: .3s;} .news .newsList .ul li p{color: #999; margin: 0; line-height: calc(30/16); margin-top: 1em;} .news .newsList .ul li:hover aside{color: #155091;} .news .newsList .ul li:hover .top::after {width: 100%;} .news .Page002623{padding: 0;} .news .newsList .more {display: block;text-align: center;} .news .newsList .more a {display: inline-block;padding-left: 50px;padding-right: 74px; color: #fff; line-height: 40px;font-size: 16px; background: url(../images/PicList002797-more.png) no-repeat 74% center #155091;border-radius: 5px;transition: all 0.5s ease-out 0s;} @media(max-width:1024px){ .news .newsList .ul{gap: 1em 3%;} .news .newsList .ul li{width: 48.5%;} .news .newsList .ul li aside{font-size: calc(18/16 * 1em);} } @media(max-width:1000px) { .news .newsList .more{margin-top: 10px;} .news .newsList .more a{padding-left: 20px;padding-right: 56px;line-height: 30px;} } @media(max-width:640px){ .news .newsList .ul li{width: 100%;} } @media(max-width:480px) { .news .newsList .more a{padding-left: 20px;padding-right: 46px;line-height: 30px;} } .newsDetail .auto{padding: calc(80/1920 * 100%) 0;} .newsDetail .titleBox{text-align: center; padding: calc(60/1600 * 100%); background-color: #f7f7f7;} .newsDetail .titleBox h1{font-size: calc(28/16 * 1em); color: #333; margin: 0;} .newsDetail .titleBox time{ color: #999; margin-top: calc(28/18 * 1em); display: block;} .newsDetail article{margin: 0 auto; padding: calc(50/1440 * 100%) 0; margin-bottom: calc(50/1440 * 100%); border-bottom: 1px solid #ebebeb;} .newsDetail article p{margin: 0; color: #333; line-height: calc(28/16);} .newsDetail article p:not(:nth-last-of-type(1)){margin-bottom: calc(28/1440 * 100%);} .newsDetail article img{display: block; margin: calc(40/1440 * 100%) auto;} .newsDetail .pn-page{ margin: 0 auto; position: relative; display: flex; justify-content: space-between; align-items: center;} .newsDetail .pn-page aside{width: calc((100% - (160/16 * 1em) - 1em)/2);} .newsDetail .pn-page aside b{display: inline-block; width: calc(12/18 * 1em); height: calc(12/18 * 1em); background: url(../images/newsdetail_arrow.svg) no-repeat center; background-size: cover;} .newsDetail .pn-page aside a{font-size: calc(16/16 * 1em); color: #666666; } .newsDetail .pn-page aside.prev b{margin-right: 1em;} .newsDetail .pn-page aside.next b{margin-left: 1em; transform: rotate(180deg);} .newsDetail .pn-page .return{height: calc(50/16 * 1em); transition: .3s; font-size: calc(16/16 * 1em); padding: 0 calc(34/16 * 1em); border-radius: 9999px; color: #fff; background-color: #155091; display: flex; align-items: center;} .newsDetail .pn-page .return::before{content: ""; width: calc(16/16 * 1em); height: calc(14/16 * 1em); margin-right: calc(12/16 * 1em); background: url(../images/newsdetail_return.svg) no-repeat center; background-size: cover;} @media(max-width:1024px){ .newsDetail .titleBox h1{font-size: calc(24/16 * 1em);} .newsDetail .pn-page .operating{order: 2;} .newsDetail .pn-page{flex-wrap: wrap; gap: 1em;} .newsDetail .pn-page aside{width: 100%; max-width: 100%;} } .ul_sitemap{list-style-type: none;} .open_inner{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; height: 100%; z-index: 1000; display: none; background-color: rgba(0,0,0,0.5); } .open_inner .flexbox{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } .open_inner .inner{ width: 92%; max-width: 700px; position: relative; background-color: #fff; } .open_inner .close{ position: absolute; right: 10px; top: 10px; width: calc(40/16 * 1em); height: calc(40/16 * 1em); cursor: pointer; } .open_inner .close::before, .open_inner .close::after{ content: ''; position: absolute; left: 50%; top: 50%; width: 2px; height: 80%; transform: translate(-50%,-50%) rotate(45deg); background-color: #333; border-radius:5px; } .open_inner .close::after{ transform: translate(-50%,-50%) rotate(-45deg);} .open_inner .content{ max-height:75vh; overflow:auto; padding:2%; text-align:center;}